R Shinydashboard Custom Css To Valuebox

I have been trying to change the color of the valueBox to a custom color (beyond those available in validColors) but have been unable to do so. I understand there is a way of using

Solution 1:

Hi you can overwrite a CSS class to add a custom color with tags$style in the ui like below, modify background-color for the box color (here a flashy yellow) and color for the text color. Here only box with color = "yellow" will be modified since only the class .small-box.bg-yellow is updated.

library("shiny")
library("shinydashboard")

ui<- dashboardPage(
  dashboardHeader(),  
  dashboardSidebar(),  
  dashboardBody(
    tags$style(".small-box.bg-yellow { background-color: #FFFF00 !important; color: #000000 !important; }"),
    fluidRow(
      valueBoxOutput("name1"), 
      valueBoxOutput("name2")
    )
  )
)

server<- function(input, output){
  output$name1 <- renderValueBox({
    valueBox("example", subtitle = "Subtitle text", color = "yellow")
  })
  output$name2 <- renderValueBox({
    valueBox("example", subtitle = "Subtitle text", color = "blue")
  })
}
shinyApp(ui = ui, server = server)