Change the Font Used in htmlwidgets for R

In this article, we will see how to change the font used in htmlwidgets for R programming language.

What are Htmlwidgets in R

The htmlwidgets is a package in R language that allows the creation of interactive HTML widgets using R code. It provides a framework for creating widgets using HTML, CSS, and JavaScript. It allows users to create interactive visualizations by combining the power of R with the flexibility of web technologies. The package supports a variety of widgets such as charts, maps, and tables. These widgets can be embedded in a web page or displayed in the RStudio viewer pane. 

Change the Font in htmlwidgets for R

To change the font used in htmlwidgets for R, you need to modify the CSS (Cascading Style Sheets) of the widget. 

Example 1

In this example, we changed the font to ‘Monospace‘ and the size of the as well. The ‘highlight’ parameter when set to TRUE, will highlight the row on which the mouse pointer hovers.

R

library(htmlwidgets)
library(reactable)

reactable(head(iris, 11),
          style = list(fontFamily = 'monospace',
                       fontSize = '18px'),
         highlight = TRUE)

Output:

Changing the htmlwidget font to Monospace

Examples 1

In this example, we will create an interactive table using the retractable package and customize its style and content using the style parameter.

R

library(htmlwidgets)
library(reactable)

reactable(head(iris, 11),
          style = list(fontFamily = 'cursive',
                       fontSize = '12px', color='blue'))

Output:

Changing the htmlwidget font to Cursive and color to blue