Template Variables

The following table shows the template variables, their default values in the standard xaringanthemer theme, the primary element to which the property is applied, and a brief description of the template variable.

For example, background_color by default sets the background-color CSS property of the .remark-slide-content class to #FFF.

Use this table to find the template variable you would like to modify. You can also use this table to find the CSS class or element associated with a particular template item.

Note that some theme functions, like style_mono_accent(), have additional parameters and a specific set of default values unique to the theme. However, with any theme function you can override the theme’s defaults by directly setting any of the arguments listed below when calling the theme function.

To be concrete, style_mono_accent() has three additional arguments: base_color (the accent color), white_color, and black_color. In this theme, the background slide color defaults to white_color, but you can choose a different slide background color by setting background_color, for example background_color = "#EAEAEA".

Variable Description Element CSS Property Default CSS Variable
text_color Text Color body #000 --text_color
header_color Header Color h1, h2, h3 #000 --header-color
background_color Slide Background Color .remark-slide-content #FFF --background-color
link_color Link Color a, a > code rgb(249, 38, 114) --link-color
text_bold_color Bold Text Color strong NULL --text-bold-color
text_slide_number_color Slide Number Color .remark-slide-number inverse_background_color
padding Slide Padding in top right [bottom left] format .remark-slide-content padding 16px 64px 16px 64px
background_image Background image applied to each and every slide. Set title_slide_background_image = "none" to remove the background image from the title slide .remark-slide-content NULL
background_size Background image size, requires background_image to be set. If background_image is set, background_size will default to cover so the background fills the screen. If both background_image and background_position are set, will default to 100 percent .remark-slide-content background-size NULL
background_position Background image position, requires background_image to be set, and it is recommended to adjust background_size .remark-slide-content background-position NULL
code_highlight_color Code Line Highlight .remark-code-line-highlighted rgba(255,255,0,0.5) --code-highlight-color
code_inline_color Inline Code Color .remark-inline-code #000
code_inline_background_color Inline Code Background Color .remark-inline-code NULL
code_inline_font_size Inline Code Text Font Size .remark-inline-code font-size 1em --code-inline-font-size
inverse_background_color Inverse Background Color .inverse #272822 --inverse-background-color
inverse_text_color Inverse Text Color .inverse #d6d6d6 --inverse-text-color
inverse_text_shadow Enables Shadow on text of inverse slides .inverse FALSE
inverse_header_color Inverse Header Color .inverse h1, .inverse h2, .inverse h3 #f3f3f3 --inverse-header-color
inverse_link_color Inverse Link Color .inverse a, .inverse a > code link_color --inverse-link-color
title_slide_text_color Title Slide Text Color .title-slide inverse_text_color --title-slide-text-color
title_slide_background_color Title Slide Background Color .title-slide inverse_background_color --title-slide-background-color
title_slide_background_image Title Slide Background Image URL .title-slide NULL
title_slide_background_size Title Slide Background Image Size, defaults to “cover” if background image is set .title-slide background-size NULL
title_slide_background_position Title Slide Background Image Position .title-slide background-position NULL
footnote_color Footnote text color (if NA, then it will be the same color as text_color) .footnote NULL
footnote_font_size Footnote font size .footnote font-size 0.9em
footnote_position_bottom Footnote location from bottom of screen .footnote position 60px
left_column_subtle_color Left Column Text (not last) .left-column h2, .left-column h3 #777
left_column_selected_color Left Column Current Selection .left-column h2:last-of-type, .left-column h3:last-child #000
blockquote_left_border_color Blockquote Left Border Color blockquote lightgray
table_border_color Table top/bottom border table: border-top, border-bottom #666
table_row_border_color Table row inner bottom border table thead th: border-bottom #ddd
table_row_even_background_color Table Even Row Background Color thead, tfoot, tr:nth-child(even) #eee
base_font_size Base Font Size for All Slide Elements (must be px) html 20px --base-font-size
text_font_size Slide Body Text Font Size .remark-slide-content font-size 1rem --text-font-size
header_h1_font_size h1 Header Text Font Size .remark-slide-content h1 font-size 2.75rem --header-h1-font-size
header_h2_font_size h2 Header Text Font Size .remark-slide-content h2 font-size 2.25rem --header-h2-font-size
header_h3_font_size h3 Header Text Font Size .remark-slide-content h3 font-size 1.75rem --header-h3-font-size
header_background_auto Add background under slide title automatically for h1 header elements. If not enabled, use class: header_background to enable FALSE
header_background_color Background Color for h1 Header with Background .remark-slide-content h1 header_color --header-background-color
header_background_text_color Text Color for h1 Header with Background .remark-slide-content h1 background_color --header-background-text-color
header_background_padding Padding for h1 Header with Background .remark-slide-content h1 padding NULL
header_background_content_padding_top Top Padding for Content in Slide with Header with Background .remark-slide-content 7rem
header_background_ignore_classes Slide Classes Where Header with Background will not be Applied .remark-slide-content c(‘normal’, ‘inverse’, ‘title’, ‘middle’, ‘bottom’)
text_slide_number_font_size Slide Number Text Font Size .remark-slide-number font-size 0.9rem
text_font_google Use google_font() to specify body font body NULL
text_font_family Body Text Font Family (xaringan default is 'Droid Serif') body xaringanthemer_font_default(“text_font_family”) --text-font-family
text_font_weight Body Text Font Weight body font-weight xaringanthemer_font_default(“text_font_weight”)
text_bold_font_weight Body Bold Text Font Weight strong bold
text_font_url Body Text Font URL(s) @import url() xaringanthemer_font_default(“text_font_url”)
text_font_family_fallback Body Text Font Fallbacks body xaringanthemer_font_default(“text_font_family_fallback”) --text-font-family-fallback
text_font_base Body Text Base Font (Total Failure Fallback) body sans-serif --text-font-base
header_font_google Use google_font() to specify header font body NULL
header_font_family Header Font Family (xaringan default is 'Yanone Kaffeesatz') h1, h2, h3 xaringanthemer_font_default(“header_font_family”) --header-font-family
header_font_weight Header Font Weight h1, h2, h3 font-weight xaringanthemer_font_default(“header_font_weight”)
header_font_family_fallback Header Font Family Fallback h1, h2, h3 Georgia, serif --header-font-family-fallback
header_font_url Header Font URL @import url xaringanthemer_font_default(“header_font_url”)
code_font_google Use google_font() to specify code font body NULL
code_font_family Code Font Family .remark-code, .remark-inline-code xaringanthemer_font_default(“code_font_family”) --code-font-family
code_font_size Code Text Font Size .remark-inline font-size 0.9rem --code-font-size
code_font_url Code Font URL @import url xaringanthemer_font_default(“code_font_url”)
code_font_family_fallback Code Font Fallback .remark-code, .remark-inline-code xaringanthemer_font_default(“code_font_family_fallback”)
link_decoration Text decoration of links a, a > code text-decoration none