Change color in materialSwitch in Rshiny

user_10431378 0
Viewed 154

i'm building Rshiny app, i'd like to customize my materialSwitch icon, the problem is that i'm unable to change the color, i can select only one of these themes (default, primary, info, success, warning, danger.), i'd like to use this color "#c110a0" instead primary

ui <- fluidPage(
  
 materialSwitch(inputId = "group1_", label = "Section 1",value = TRUE, status = "primary", right = TRUE )
)

server <- function(input, output, session) {
  
}

shinyApp(ui, server)

Thanks !!

shiny customization r colors
1 Answers

You can create a custom class to change the color of a default them to be whatever you would like. Here are the directions to do so (these will allow you to change other things in the app, too!):

  • When you run your app, right click the portion of the app you would like and inspect element to open RStudio Devtools
  • On the right-hand "style" panel, you will find a list of CSS styles that are applied to it. One of them will show the color and the identifier for that object.
  • Then, you can apply custom CSS to your shiny app in several different forms (explained in this article).

In your case, the identifier is .label-primary. enter image description here

Adding custom CSS using

.label-primary{
background-color: #c110a0;
}

Renders the following:

enter image description here

user_152864820
Related