55

I am using below code in server.R to display the text in the main panel. This is working exactly the way it should work.

output$text1 <- renderText({
  if(input$ag == 0) return(NULL)
  return('First 20 rows for requested AG')
})

Is there any way to change the font and color of the text?

Piyush
  • 1,571
  • 4
  • 14
  • 21
  • AFAIK renderText just outputs its text like cat. You probably need to use CSS to change the text style. See here for a Google Groups discussion that (I think) includes your issue. – jbaums Jun 04 '14 at 23:36
  • 1
    Just realised I didn't provide the url :/ [here it is](https://groups.google.com/forum/#!topic/shiny-discuss/xWyaOryOkVs) (and on second glance it may not be in the context of `renderText`). – jbaums Jun 05 '14 at 09:35

4 Answers4

63

You can use css as @jbaums indicated

library(shiny)
runApp(list(
  ui = bootstrapPage(
    numericInput('n', 'Number of obs', 100),
    textOutput('text1'),
    tags$head(tags$style("#text1{color: red;
                                 font-size: 20px;
                                 font-style: italic;
                                 }"
                         )
              )
  ),
  server = function(input, output) {
    output$text1 <- renderText({ paste("hello input is",input$n) })
  }
))

Normally you would include this in a styles.css file but it is shown inline here to be self contained. #text1 refers to the DOM element with id=text1 and the contents of the curly brackets are the relevant styles.

jdharrison
  • 30,085
  • 4
  • 77
  • 89
  • 2
    For anyone who _does_ want to separate R and CSS, this blog includes good examples of how to do this using a separate CSS file: https://shiny.rstudio.com/articles/css.html – lauren.marietta Oct 18 '19 at 17:47
  • thanks! For those who aren't familiar with the CSS syntax, can i add tags of other text outputs after `#text1` that I want to be similarily formatted? Say, separated with a comma: `#text1,#text2`? – Emile Zäkiev Jun 05 '23 at 08:45
61

in ui.r:

span(textOutput("message"), style="color:red")

in server.r:

output$message <- renderText({"This is some red text"})
agenis
  • 8,069
  • 5
  • 53
  • 102
MikeP
  • 751
  • 5
  • 6
  • 2
    To add to this, you can do the same without `textOutput`, if it is to be static in the UI. – vladli Jan 22 '20 at 09:29
  • To add also the font and size: in `ui.r`: `span(textOutput("message"), style = "color:red; font-size:20px; font-family:arial; font-style:italic")` – EmaK Jan 24 '23 at 22:16
46

If only want to change a certain part of the returning string, one can use htmlOutput instead of textOutput

On server side just return 

output$text1 <- renderText({ paste("hello input is","<font color=\"#FF0000\"><b>", input$n, "</b></font>") })

In this way, Shiny UI will perform HTML.

athlonshi
  • 1,711
  • 1
  • 19
  • 23
17

The solution by @MikeP also works with p(), fx p("some text", style = "color:red"), so you can also just wrap that in a renderText() from the server if you want to display it dynamically.

Kasper Skytte Andersen
  • 591
  • 5
  • 13