title: Programmatically change css in Shiny script
body: <p>I wish to change the color of text in a Shiny app based on a user's input. Here's a simple example. Is this basically the correct approach?  If I hard code the css it works. For example, if I change:</p>
  
  <pre><code>div(style = css_stub,
  </code></pre>
  
  <p>to</p>
  
  <pre><code>div(style = "inline-block;  red;",
  </code></pre>
  
  <p>the text color changes. Please explain how to alter css in a Shiny app programmatically.</p>
  
  <pre><code>library(shiny)
  
  css_stub &lt;- paste0("'", "inline-block;  color:black;", "'")
  
  ui &lt;- fluidPage(
  
    titlePanel("Color Test"),
    sidebarLayout(
      sidebarPanel(
  
        selectInput(inputId = "colors",
                    label = "Choose a color:",
                    choices = c("red", "blue"))
      ),
  
      mainPanel(
        div(style = css_stub, 
            textOutput("text_out"))
  
      )
    )
  )
  
  server &lt;- function(input, output) {
    observeEvent(input$colors, {
      if (input$colors == "red") {
        css_stub &lt;- paste0("'", "inline-block;  color:red;", "'")
        output$text_out &lt;- renderText({"hello - red"})
      } else {
        css_stub &lt;- paste0("'", "inline-block;  color:blue;", "'")
        output$text_out &lt;- renderText({"hello - blue"})
      }
    })
  
  }
  
  
  shinyApp(ui = ui, server = server)
  </code></pre>