Help for package xaringanthemer

Type:

Package

Title:

Custom 'xaringan' CSS Themes

Version:

0.4.3

Description:

Create beautifully color-coordinated and customized themes for your 'xaringan' slides, without writing any CSS. Complete your slide theme with 'ggplot2' themes that match the font and colors used in your slides. Customized styles can be created directly in your slides' 'R Markdown' source file or in a separate external script.

License:

MIT + file LICENSE

URL:

https://pkg.garrickadenbuie.com/xaringanthemer/, https://github.com/gadenbuie/xaringanthemer

BugReports:

https://github.com/gadenbuie/xaringanthemer/issues

Depends:

R (≥ 2.10)

Imports:

colorspace, glue, methods, purrr, utils, whisker

Suggests:

callr, ggplot2, knitr, mockery, rmarkdown, scales, showtext, sysfonts, testthat (≥ 2.1.0), xaringan

VignetteBuilder:

knitr

Config/Needs/website:

gadenbuie/grkgdown, pkgdown

Config/testthat/edition:

Encoding:

UTF-8

RoxygenNote:

7.3.2

NeedsCompilation:

Packaged:

2024-09-15 13:48:43 UTC; garrick

Author:

Garrick Aden-Buie

[aut, cre]

Maintainer:

Garrick Aden-Buie <garrick@adenbuie.com>

Repository:

CRAN

Date/Publication:

2024-09-15 14:00:02 UTC

xaringanthemer: Custom 'xaringan' CSS Themes

Description

Author(s)

Maintainer: Garrick Aden-Buie garrick@adenbuie.com (ORCID)

Add alpha to hex color

Description

Applies alpha (or opacity) to a color in hexadecimal form by converting opacity in the ⁠[0, 1]⁠ range to hex in the ⁠[0, 255]⁠ range and appending to the hex color.

Usage

apply_alpha(color_hex, opacity = 0.5)

Arguments

color_hex

A character string representing a hex color

opacity

Desired opacity of the output color

Value

A character string with added opacity level as hexadecimal characters.

Examples

blue <- "#0e6ba8"
blue_transparent <- apply_alpha(blue)

if (requireNamespace("scales", quietly = TRUE)) {
  scales::show_col(c(blue, blue_transparent))
}

Choose dark or light color

Description

Takes a color input as x and returns either the black or white color (or expression) if dark or light text should be used over the input color for best contrast. Follows W3C Recommendations.

Usage

choose_dark_or_light(x, black = "#000000", white = "#FFFFFF")

Arguments

x

The background color (hex)

black

Text or foreground color, e.g. "#222" or substitute(darken_color(x, 0.8)), if black text provides the best contrast.

white

Text or foreground color or expression, e.g. "#EEE" or substitute(lighten_color(x, 0.8)), if white text provides the best contrast.

Value

The black color or white color according to which color provides the greates contrast with the input color.

References

https://stackoverflow.com/a/3943023/2022615

Examples

light_green <- "#c4d6b0"
contrast_green <- choose_dark_or_light(light_green)
dark_purple <- "#381d2a"
contrast_purple <- choose_dark_or_light(dark_purple)

if (requireNamespace("scales", quietly = TRUE)) {
  scales::show_col(c(light_green, contrast_green, dark_purple, contrast_purple))
}

Specify Google Font

Description

Builds Google Fonts URL from family name. Extra weights are given in the ... parameters. Languages can be specified in languages and must one or more of the language codes as given by google_language_codes().

Usage

google_font(family, ..., languages = NULL)

Arguments

family

Font family

...

Font weights to include, example "400", "400i"

languages

Font languages to include (dependent on the font.) See google_language_codes().

Value

A "google_font" object.

Examples

google_font("Josefin Sans", "400", "400i", "600i", "700")
google_font("Josefin Sans", languages = c("latin-ext", "vietnamese"))

List Valid Google Language Codes

Description

Gives a list of valid Language Codes for Google Fonts, or validates that the language codes given are valid.

Usage

google_language_codes(
  language_codes = c("latin", "latin-ext", "sinhala", "greek", "hebrew", "vietnamese",
    "cyrillic", "cyrillic-ext", "devanagari", "arabic", "khmer", "tamil", "greek-ext",
    "thai", "bengali", "gujarati", "oriya", "malayalam", "gurmukhi", "kannada", "telugu",
    "myanmar")
)

Arguments

language_codes

Vector of potential Google language codes

Value

A vector of Google Font language codes matching language_codes.

Generate lighter or darker version of a color

Description

Produces a linear blend of the color with white or black.

Usage

lighten_color(color_hex, strength = 0.7)

darken_color(color_hex, strength = 0.8)

Arguments

color_hex

A character string representing a hex color

strength

The "strength" of the blend with white or black, where 0 is entirely the original color and 1 is entirely white (lighten_color()) or black (darken_color()).

Value

A character string with the lightened or darkened color in hexadecimal format.

Examples

blue <- "#0e6ba8"
blue_light <- lighten_color(blue, strength = 0.33)
blue_dark <- darken_color(blue, strength = 0.33)

if (requireNamespace("scales", quietly = TRUE)) {
  scales::show_col(c(blue_light, blue, blue_dark))
}

Themed ggplot2 Scales

Description

Color and fill single-color scales for discrete and continuous values, created using the primary accent color of the xaringanthemer styles. See vignette("ggplot2-themes") for more information and examples of xaringanthemer's ggplot2-related functions.

Usage

scale_xaringan_discrete(
  aes_type = c("color", "colour", "fill"),
  ...,
  color = NULL,
  direction = 1,
  inverse = FALSE
)

scale_xaringan_fill_discrete(..., color = NULL, direction = 1, inverse = FALSE)

scale_xaringan_color_discrete(
  ...,
  color = NULL,
  direction = 1,
  inverse = FALSE
)

scale_xaringan_colour_discrete(
  ...,
  color = NULL,
  direction = 1,
  inverse = FALSE
)

scale_xaringan_continuous(
  aes_type = c("color", "colour", "fill"),
  ...,
  color = NULL,
  begin = 0,
  end = 1,
  inverse = FALSE
)

scale_xaringan_fill_continuous(
  ...,
  color = NULL,
  begin = 0,
  end = 1,
  inverse = FALSE
)

scale_xaringan_color_continuous(
  ...,
  color = NULL,
  begin = 0,
  end = 1,
  inverse = FALSE
)

scale_xaringan_colour_continuous(
  ...,
  color = NULL,
  begin = 0,
  end = 1,
  inverse = FALSE
)

Arguments

aes_type

The type of aesthetic to which the scale is being applied. One of "color", "colour", or "fill".

...

Arguments passed on to either the colorspace scale functions — one of colorspace::scale_color_discrete_sequential(), colorspace::scale_color_continuous_sequential(), colorspace::scale_fill_discrete_sequential(), or colorspace::scale_fill_continuous_sequential() — or to ggplot2::continuous_scale or ggplot2::discrete_scale.

color

A color value, in hex, to override the default color. Otherwise, the primary color of the resulting scale is chosen from the xaringanthemer slide styles.

direction

Direction of the discrete scale. Use values less than 0 to reverse the direction, e.g. direction = -1.

inverse

If color is not supplied and inverse = TRUE, a primary color is chosen to work well with the inverse slide styles, namely the value of inverse_header_color

begin

Number in the range of [0, 1] indicating to which point in the color scale the smallest data value should be mapped.

end

Number in the range of [0, 1] indicating to which point in the color scale the largest data value should be mapped.

Examples

# Requires ggplot2
has_ggplot2 <- requireNamespace("ggplot2", quietly = TRUE)

if (has_ggplot2) {
  library(ggplot2)
  # Saving the theme to a temp file because this is an example
  path_to_css_file <- tempfile(fileext = ".css")

  # Create the xaringan theme: dark blue background with teal green accents
  style_duo(
    primary_color = "#002b36",
    secondary_color = "#31b09e",
    # Using basic fonts for this example, but the plot theme will
    # automatically use your theme font if you use Google fonts
    text_font_family = "sans",
    header_font_family = "serif",
    outfile = path_to_css_file
  )

  # Here's some very basic example data
  ex <- data.frame(
    name = c("Couple", "Few", "Lots", "Many"),
    n = c(2, 3, 5, 7)
  )

  # Fill color scales demo
  ggplot(ex) +
    aes(name, n, fill = n) +
    geom_col() +
    ggtitle("Matching fill scales") +
    # themed to match the slides: dark blue background with teal text
    theme_xaringan() +
    # Fill color matches teal text
    scale_xaringan_fill_continuous()

  # Color scales demo
  ggplot(ex) +
    aes(name, y = 1, color = name) +
    geom_point(size = 10) +
    ggtitle("Matching color scales") +
    # themed to match the slides: dark blue background with teal text
    theme_xaringan() +
    # Fill color matches teal text
    scale_xaringan_color_discrete(direction = -1)
}

Duotone Theme

Description

A duotone theme designed to work well with two complementary colors.

Usage

style_duo(
  primary_color = "#1F4257",
  secondary_color = "#F97B64",
  text_color = choose_dark_or_light(primary_color, darken_color(primary_color, 0.9),
    lighten_color(secondary_color, 0.99)),
  header_color = secondary_color,
  background_color = primary_color,
  link_color = secondary_color,
  text_bold_color = secondary_color,
  text_slide_number_color = text_color,
  padding = "16px 64px 16px 64px",
  background_image = NULL,
  background_size = NULL,
  background_position = NULL,
  code_highlight_color = "rgba(255,255,0,0.5)",
  code_inline_color = secondary_color,
  code_inline_background_color = NULL,
  code_inline_font_size = "1em",
  inverse_background_color = secondary_color,
  inverse_text_color = primary_color,
  inverse_text_shadow = FALSE,
  inverse_header_color = inverse_text_color,
  inverse_link_color = link_color,
  title_slide_text_color = secondary_color,
  title_slide_background_color = primary_color,
  title_slide_background_image = NULL,
  title_slide_background_size = NULL,
  title_slide_background_position = NULL,
  footnote_color = NULL,
  footnote_font_size = "0.9em",
  footnote_position_bottom = "60px",
  left_column_subtle_color = apply_alpha(secondary_color, 0.6),
  left_column_selected_color = secondary_color,
  blockquote_left_border_color = apply_alpha(secondary_color, 0.5),
  table_border_color = "#666",
  table_row_border_color = "#ddd",
  table_row_even_background_color = lighten_color(primary_color, 0.9),
  base_font_size = "20px",
  text_font_size = "1rem",
  header_h1_font_size = "2.75rem",
  header_h2_font_size = "2.25rem",
  header_h3_font_size = "1.75rem",
  header_background_auto = FALSE,
  header_background_color = header_color,
  header_background_text_color = background_color,
  header_background_padding = NULL,
  header_background_content_padding_top = "7rem",
  header_background_ignore_classes = c("normal", "inverse", "title", "middle", "bottom"),
  text_slide_number_font_size = "0.9rem",
  text_font_google = NULL,
  text_font_family = xaringanthemer_font_default("text_font_family"),
  text_font_weight = xaringanthemer_font_default("text_font_weight"),
  text_bold_font_weight = "bold",
  text_font_url = xaringanthemer_font_default("text_font_url"),
  text_font_family_fallback = xaringanthemer_font_default("text_font_family_fallback"),
  text_font_base = "sans-serif",
  header_font_google = NULL,
  header_font_family = xaringanthemer_font_default("header_font_family"),
  header_font_weight = xaringanthemer_font_default("header_font_weight"),
  header_font_family_fallback = "Georgia, serif",
  header_font_url = xaringanthemer_font_default("header_font_url"),
  code_font_google = NULL,
  code_font_family = xaringanthemer_font_default("code_font_family"),
  code_font_size = "0.9rem",
  code_font_url = xaringanthemer_font_default("code_font_url"),
  code_font_family_fallback = xaringanthemer_font_default("code_font_family_fallback"),
  link_decoration = "none",
  colors = NULL,
  extra_css = NULL,
  extra_fonts = NULL,
  outfile = "xaringan-themer.css"
)

Arguments

primary_color

Duotone Primary Color. Defaults to #1F4257. Used in multiple CSS rules. The value of this variable is also stored as a CSS variable that can be referenced with var(--primary) in any argument of a style function or in custom CSS.

secondary_color

Duotone Secondary Color. Defaults to #F97B64. Used in multiple CSS rules. The value of this variable is also stored as a CSS variable that can be referenced with var(--secondary) in any argument of a style function or in custom CSS.

text_color

Text Color. Defaults to choose_dark_or_light(primary_color, darken_color(primary_color, 0.9), lighten_color(secondary_color, 0.99)). Modifies the body element. The value of this variable is also stored as a CSS variable that can be referenced with var(--text_color) in any argument of a style function or in custom CSS.

header_color

Header Color. Defaults to secondary_color. Modifies the ⁠h1, h2, h3⁠ elements. The value of this variable is also stored as a CSS variable that can be referenced with var(--header-color) in any argument of a style function or in custom CSS.

background_color

Slide Background Color. Defaults to primary_color. Modifies the .remark-slide-content class. The value of this variable is also stored as a CSS variable that can be referenced with var(--background-color) in any argument of a style function or in custom CSS.

link_color

Link Color. Defaults to secondary_color. Modifies the ⁠a, a > code⁠ elements. The value of this variable is also stored as a CSS variable that can be referenced with var(--link-color) in any argument of a style function or in custom CSS.

text_bold_color

Bold Text Color. Defaults to secondary_color. Modifies the strong element. The value of this variable is also stored as a CSS variable that can be referenced with var(--text-bold-color) in any argument of a style function or in custom CSS.

text_slide_number_color

Slide Number Color. Defaults to text_color. Modifies the .remark-slide-number class.

padding

Slide Padding in ⁠top right [bottom left]⁠ format. Defaults to 16px 64px 16px 64px. Modifies the .remark-slide-content class. Accepts CSS padding property values.

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. Defaults to NULL. Modifies the .remark-slide-content class.

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. Defaults to NULL. Modifies the .remark-slide-content class. Accepts CSS background-size property values.

background_position

Background image position, requires background_image to be set, and it is recommended to adjust background_size. Defaults to NULL. Modifies the .remark-slide-content class. Accepts CSS background-position property values.

code_highlight_color

Code Line Highlight. Defaults to rgba(255,255,0,0.5). Modifies the .remark-code-line-highlighted class. The value of this variable is also stored as a CSS variable that can be referenced with var(--code-highlight-color) in any argument of a style function or in custom CSS.

code_inline_color

Inline Code Color. Defaults to secondary_color. Modifies the .remark-inline-code class.

code_inline_background_color

Inline Code Background Color. Defaults to NULL. Modifies the .remark-inline-code class.

code_inline_font_size

Inline Code Text Font Size. Defaults to 1em. Modifies the .remark-inline-code class. Accepts CSS font-size property values. The value of this variable is also stored as a CSS variable that can be referenced with var(--code-inline-font-size) in any argument of a style function or in custom CSS.

inverse_background_color

Inverse Background Color. Defaults to secondary_color. Modifies the .inverse class. The value of this variable is also stored as a CSS variable that can be referenced with var(--inverse-background-color) in any argument of a style function or in custom CSS.

inverse_text_color

Inverse Text Color. Defaults to primary_color. Modifies the .inverse class. The value of this variable is also stored as a CSS variable that can be referenced with var(--inverse-text-color) in any argument of a style function or in custom CSS.

inverse_text_shadow

Enables Shadow on text of inverse slides. Defaults to FALSE. Modifies the .inverse class.

inverse_header_color

Inverse Header Color. Defaults to inverse_text_color. Modifies the ⁠.inverse h1, .inverse h2, .inverse h3⁠ classes. The value of this variable is also stored as a CSS variable that can be referenced with var(--inverse-header-color) in any argument of a style function or in custom CSS.

inverse_link_color

Inverse Link Color. Defaults to link_color. Modifies the ⁠.inverse a, .inverse a > code⁠ classes. The value of this variable is also stored as a CSS variable that can be referenced with var(--inverse-link-color) in any argument of a style function or in custom CSS.

title_slide_text_color

Title Slide Text Color. Defaults to secondary_color. Modifies the .title-slide class. The value of this variable is also stored as a CSS variable that can be referenced with var(--title-slide-text-color) in any argument of a style function or in custom CSS.

title_slide_background_color

Title Slide Background Color. Defaults to primary_color. Modifies the .title-slide class. The value of this variable is also stored as a CSS variable that can be referenced with var(--title-slide-background-color) in any argument of a style function or in custom CSS.

title_slide_background_image

Title Slide Background Image URL. Defaults to NULL. Modifies the .title-slide class.

title_slide_background_size

Title Slide Background Image Size, defaults to "cover" if background image is set. Defaults to NULL. Modifies the .title-slide class. Accepts CSS background-size property values.

title_slide_background_position

Title Slide Background Image Position. Defaults to NULL. Modifies the .title-slide class. Accepts CSS background-position property values.

footnote_color

Footnote text color (if NA, then it will be the same color as text_color). Defaults to NULL. Modifies the .footnote class.

footnote_font_size

Footnote font size. Defaults to 0.9em. Modifies the .footnote class. Accepts CSS font-size property values.

footnote_position_bottom

Footnote location from bottom of screen. Defaults to 60px. Modifies the .footnote class. Accepts CSS position property values.

left_column_subtle_color

Left Column Text (not last). Defaults to apply_alpha(secondary_color, 0.6). Modifies the ⁠.left-column h2, .left-column h3⁠ classes.

left_column_selected_color

Left Column Current Selection. Defaults to secondary_color. Modifies the ⁠.left-column h2:last-of-type, .left-column h3:last-child⁠ classes.

blockquote_left_border_color

Blockquote Left Border Color. Defaults to apply_alpha(secondary_color, 0.5). Modifies the blockquote element.

table_border_color

Table top/bottom border. Defaults to #666. Modifies the ⁠table: border-top, border-bottom⁠ elements.

table_row_border_color

Table row inner bottom border. Defaults to #ddd. Modifies the ⁠table thead th: border-bottom⁠ elements.

table_row_even_background_color

Table Even Row Background Color. Defaults to lighten_color(primary_color, 0.9). Modifies the ⁠thead, tfoot, tr:nth-child(even)⁠ elements.

base_font_size

Base Font Size for All Slide Elements (must be px). Defaults to 20px. Modifies the html element. The value of this variable is also stored as a CSS variable that can be referenced with var(--base-font-size) in any argument of a style function or in custom CSS.

text_font_size

Slide Body Text Font Size. Defaults to 1rem. Modifies the .remark-slide-content class. Accepts CSS font-size property values. The value of this variable is also stored as a CSS variable that can be referenced with var(--text-font-size) in any argument of a style function or in custom CSS.

header_h1_font_size

h1 Header Text Font Size. Defaults to 2.75rem. Modifies the ⁠.remark-slide-content h1⁠ class. Accepts CSS font-size property values. The value of this variable is also stored as a CSS variable that can be referenced with var(--header-h1-font-size) in any argument of a style function or in custom CSS.

header_h2_font_size

h2 Header Text Font Size. Defaults to 2.25rem. Modifies the ⁠.remark-slide-content h2⁠ class. Accepts CSS font-size property values. The value of this variable is also stored as a CSS variable that can be referenced with var(--header-h2-font-size) in any argument of a style function or in custom CSS.

header_h3_font_size

h3 Header Text Font Size. Defaults to 1.75rem. Modifies the ⁠.remark-slide-content h3⁠ class. Accepts CSS font-size property values. The value of this variable is also stored as a CSS variable that can be referenced with var(--header-h3-font-size) in any argument of a style function or in custom CSS.

header_background_auto

Add background under slide title automatically for h1 header elements. If not enabled, use class: header_background to enable. Defaults to FALSE.

header_background_color

Background Color for h1 Header with Background. Defaults to header_color. Modifies the ⁠.remark-slide-content h1⁠ class. The value of this variable is also stored as a CSS variable that can be referenced with var(--header-background-color) in any argument of a style function or in custom CSS.

header_background_text_color

Text Color for h1 Header with Background. Defaults to background_color. Modifies the ⁠.remark-slide-content h1⁠ class. The value of this variable is also stored as a CSS variable that can be referenced with var(--header-background-text-color) in any argument of a style function or in custom CSS.

header_background_padding

Padding for h1 Header with Background. Defaults to NULL. Modifies the ⁠.remark-slide-content h1⁠ class. Accepts CSS padding property values.

header_background_content_padding_top

Top Padding for Content in Slide with Header with Background. Defaults to 7rem. Modifies the .remark-slide-content class.

header_background_ignore_classes

Slide Classes Where Header with Background will not be Applied. Defaults to c('normal', 'inverse', 'title', 'middle', 'bottom'). Modifies the .remark-slide-content class.

text_slide_number_font_size

Slide Number Text Font Size. Defaults to 0.9rem. Modifies the .remark-slide-number class. Accepts CSS font-size property values.

text_font_google

Use google_font() to specify body font. Defaults to NULL. Modifies the body element.

text_font_family

Body Text Font Family (xaringan default is 'Droid Serif'). Defaults to xaringanthemer_font_default("text_font_family"). Modifies the body element. The value of this variable is also stored as a CSS variable that can be referenced with var(--text-font-family) in any argument of a style function or in custom CSS.

text_font_weight

Body Text Font Weight. Defaults to xaringanthemer_font_default("text_font_weight"). Modifies the body element. Accepts CSS font-weight property values.

text_bold_font_weight

Body Bold Text Font Weight. Defaults to bold. Modifies the strong element.

text_font_url

Body Text Font URL(s). Defaults to xaringanthemer_font_default("text_font_url"). Modifies the ⁠@import url()⁠ elements.

text_font_family_fallback

Body Text Font Fallbacks. Defaults to xaringanthemer_font_default("text_font_family_fallback"). Modifies the body element. The value of this variable is also stored as a CSS variable that can be referenced with var(--text-font-family-fallback) in any argument of a style function or in custom CSS.

text_font_base

Body Text Base Font (Total Failure Fallback). Defaults to sans-serif. Modifies the body element. The value of this variable is also stored as a CSS variable that can be referenced with var(--text-font-base) in any argument of a style function or in custom CSS.

header_font_google

Use google_font() to specify header font. Defaults to NULL. Modifies the body element.

header_font_family

Header Font Family (xaringan default is 'Yanone Kaffeesatz'). Defaults to xaringanthemer_font_default("header_font_family"). Modifies the ⁠h1, h2, h3⁠ elements. The value of this variable is also stored as a CSS variable that can be referenced with var(--header-font-family) in any argument of a style function or in custom CSS.

header_font_weight

Header Font Weight. Defaults to xaringanthemer_font_default("header_font_weight"). Modifies the ⁠h1, h2, h3⁠ elements. Accepts CSS font-weight property values.

header_font_family_fallback

Header Font Family Fallback. Defaults to Georgia, serif. Modifies the ⁠h1, h2, h3⁠ elements. The value of this variable is also stored as a CSS variable that can be referenced with var(--header-font-family-fallback) in any argument of a style function or in custom CSS.

header_font_url

Header Font URL. Defaults to xaringanthemer_font_default("header_font_url"). Modifies the ⁠@import url⁠ elements.

code_font_google

Use google_font() to specify code font. Defaults to NULL. Modifies the body element.

code_font_family

Code Font Family. Defaults to xaringanthemer_font_default("code_font_family"). Modifies the ⁠.remark-code, .remark-inline-code⁠ classes. The value of this variable is also stored as a CSS variable that can be referenced with var(--code-font-family) in any argument of a style function or in custom CSS.

code_font_size

Code Text Font Size. Defaults to 0.9rem. Modifies the .remark-inline class. Accepts CSS font-size property values. The value of this variable is also stored as a CSS variable that can be referenced with var(--code-font-size) in any argument of a style function or in custom CSS.

code_font_url

Code Font URL. Defaults to xaringanthemer_font_default("code_font_url"). Modifies the ⁠@import url⁠ elements.

code_font_family_fallback

Code Font Fallback. Defaults to xaringanthemer_font_default("code_font_family_fallback"). Modifies the ⁠.remark-code, .remark-inline-code⁠ classes.

link_decoration

Text decoration of links. Defaults to none. Modifies the ⁠a, a > code⁠ elements. Accepts CSS text-decoration property values.

colors

A named vector of custom colors. The names of the colors become CSS variables and classes that can be used within your slides. For example, colors = c(blue = "#bad4ed") adds a CSS variable --blue, a .blue CSS class that applies the color to the text or foreground color, and a .bg-blue CSS class that applies the color to the background.

extra_css

A named list of CSS definitions each containing a named list of CSS property-value pairs, i.e. list(".class-id" = list("css-property" = "value")).

extra_fonts

A list of additional fonts to import, each list element can be either a URL as a character string or a call to google_font(). To use a font imported in extra_fonts, you will need to write custom CSS rules that apply the font to an element or class with the font-family property. See the Fonts section of vignette("xaringanthemer") for an example.

outfile

Customized xaringan CSS output file name, default is "xaringan-themer.css"

Value

The CSS styles are written to the file path provided in outfile (by default to xaringan-themer.css). If outfile is NULL, the CSS is returned directly as a character string.

Usage

To use the styles created by this theme function, make sure that you use xaringan-themer.css as your CSS file in your slides' YAML header. If you change the name of the output file using the outfile argument, use that name instead of the default file name.

output:
xaringan::moon_reader:
  css: xaringan-themer.css

Examples

# Create a xaringan style in a temporary file
xaringan_themer_css <- tempfile("xaringan-themer-", fileext = ".css")

style_duo(
  primary_color = "#1f4257",
  secondary_color = "#f97b64",
  outfile = xaringan_themer_css # omit in your slides to write the
                                # styles to xaringan-themer.css
)

# View the CSS:
# file.edit(xaringan_themer_css)

Duotone Accent Theme

Description

An default xaringan theme with a two colors used for color accents on select elements (headers, bold text, etc.).

Usage

style_duo_accent(
  primary_color = "#035AA6",
  secondary_color = "#03A696",
  white_color = "#FFFFFF",
  black_color = "#000000",
  text_color = black_color,
  header_color = primary_color,
  background_color = white_color,
  link_color = choose_dark_or_light(secondary_color, primary_color, secondary_color),
  text_bold_color = choose_dark_or_light(secondary_color, primary_color, secondary_color),
  text_slide_number_color = primary_color,
  padding = "16px 64px 16px 64px",
  background_image = NULL,
  background_size = NULL,
  background_position = NULL,
  code_highlight_color = "rgba(255,255,0,0.5)",
  code_inline_color = choose_dark_or_light(secondary_color, primary_color,
    secondary_color),
  code_inline_background_color = NULL,
  code_inline_font_size = "1em",
  inverse_background_color = secondary_color,
  inverse_text_color = choose_dark_or_light(secondary_color, black_color, white_color),
  inverse_text_shadow = FALSE,
  inverse_header_color = inverse_text_color,
  inverse_link_color = link_color,
  title_slide_text_color = choose_dark_or_light(primary_color, black_color, white_color),
  title_slide_background_color = primary_color,
  title_slide_background_image = NULL,
  title_slide_background_size = NULL,
  title_slide_background_position = NULL,
  footnote_color = NULL,
  footnote_font_size = "0.9em",
  footnote_position_bottom = "60px",
  left_column_subtle_color = apply_alpha(primary_color, 0.6),
  left_column_selected_color = primary_color,
  blockquote_left_border_color = apply_alpha(secondary_color, 0.5),
  table_border_color = "#666",
  table_row_border_color = "#ddd",
  table_row_even_background_color = lighten_color(secondary_color, 0.8),
  base_font_size = "20px",
  text_font_size = "1rem",
  header_h1_font_size = "2.75rem",
  header_h2_font_size = "2.25rem",
  header_h3_font_size = "1.75rem",
  header_background_auto = FALSE,
  header_background_color = header_color,
  header_background_text_color = background_color,
  header_background_padding = NULL,
  header_background_content_padding_top = "7rem",
  header_background_ignore_classes = c("normal", "inverse", "title", "middle", "bottom"),
  text_slide_number_font_size = "0.9rem",
  text_font_google = NULL,
  text_font_family = xaringanthemer_font_default("text_font_family"),
  text_font_weight = xaringanthemer_font_default("text_font_weight"),
  text_bold_font_weight = "bold",
  text_font_url = xaringanthemer_font_default("text_font_url"),
  text_font_family_fallback = xaringanthemer_font_default("text_font_family_fallback"),
  text_font_base = "sans-serif",
  header_font_google = NULL,
  header_font_family = xaringanthemer_font_default("header_font_family"),
  header_font_weight = xaringanthemer_font_default("header_font_weight"),
  header_font_family_fallback = "Georgia, serif",
  header_font_url = xaringanthemer_font_default("header_font_url"),
  code_font_google = NULL,
  code_font_family = xaringanthemer_font_default("code_font_family"),
  code_font_size = "0.9rem",
  code_font_url = xaringanthemer_font_default("code_font_url"),
  code_font_family_fallback = xaringanthemer_font_default("code_font_family_fallback"),
  link_decoration = "none",
  colors = NULL,
  extra_css = NULL,
  extra_fonts = NULL,
  outfile = "xaringan-themer.css"
)

Arguments

primary_color

Duotone Primary Color. Defaults to #035AA6. Used in multiple CSS rules. The value of this variable is also stored as a CSS variable that can be referenced with var(--primary) in any argument of a style function or in custom CSS.

secondary_color

Duotone Secondary Color. Defaults to #03A696. Used in multiple CSS rules. The value of this variable is also stored as a CSS variable that can be referenced with var(--secondary) in any argument of a style function or in custom CSS.

white_color

Brightest color used. Defaults to #FFFFFF. Used in multiple CSS rules. The value of this variable is also stored as a CSS variable that can be referenced with var(--white) in any argument of a style function or in custom CSS.

black_color

Darkest color used. Defaults to #000000. Used in multiple CSS rules. The value of this variable is also stored as a CSS variable that can be referenced with var(--black) in any argument of a style function or in custom CSS.

text_color

Text Color. Defaults to black_color. Modifies the body element. The value of this variable is also stored as a CSS variable that can be referenced with var(--text_color) in any argument of a style function or in custom CSS.

header_color

Header Color. Defaults to primary_color. Modifies the ⁠h1, h2, h3⁠ elements. The value of this variable is also stored as a CSS variable that can be referenced with var(--header-color) in any argument of a style function or in custom CSS.

background_color

Slide Background Color. Defaults to white_color. Modifies the .remark-slide-content class. The value of this variable is also stored as a CSS variable that can be referenced with var(--background-color) in any argument of a style function or in custom CSS.

link_color

Link Color. Defaults to choose_dark_or_light(secondary_color, primary_color, secondary_color). Modifies the ⁠a, a > code⁠ elements. The value of this variable is also stored as a CSS variable that can be referenced with var(--link-color) in any argument of a style function or in custom CSS.

text_bold_color

Bold Text Color. Defaults to choose_dark_or_light(secondary_color, primary_color, secondary_color). Modifies the strong element. The value of this variable is also stored as a CSS variable that can be referenced with var(--text-bold-color) in any argument of a style function or in custom CSS.

text_slide_number_color

Slide Number Color. Defaults to primary_color. Modifies the .remark-slide-number class.

padding

Slide Padding in ⁠top right [bottom left]⁠ format. Defaults to 16px 64px 16px 64px. Modifies the .remark-slide-content class. Accepts CSS padding property values.

background_image

background_size

background_position

code_highlight_color

code_inline_color

Inline Code Color. Defaults to choose_dark_or_light(secondary_color, primary_color, secondary_color). Modifies the .remark-inline-code class.

code_inline_background_color

Inline Code Background Color. Defaults to NULL. Modifies the .remark-inline-code class.

code_inline_font_size

inverse_background_color

inverse_text_color

Inverse Text Color. Defaults to choose_dark_or_light(secondary_color, black_color, white_color). Modifies the .inverse class. The value of this variable is also stored as a CSS variable that can be referenced with var(--inverse-text-color) in any argument of a style function or in custom CSS.

inverse_text_shadow

Enables Shadow on text of inverse slides. Defaults to FALSE. Modifies the .inverse class.

inverse_header_color

inverse_link_color

title_slide_text_color

Title Slide Text Color. Defaults to choose_dark_or_light(primary_color, black_color, white_color). Modifies the .title-slide class. The value of this variable is also stored as a CSS variable that can be referenced with var(--title-slide-text-color) in any argument of a style function or in custom CSS.

title_slide_background_color

title_slide_background_image

Title Slide Background Image URL. Defaults to NULL. Modifies the .title-slide class.

title_slide_background_size

Title Slide Background Image Size, defaults to "cover" if background image is set. Defaults to NULL. Modifies the .title-slide class. Accepts CSS background-size property values.

title_slide_background_position

Title Slide Background Image Position. Defaults to NULL. Modifies the .title-slide class. Accepts CSS background-position property values.

footnote_color

Footnote text color (if NA, then it will be the same color as text_color). Defaults to NULL. Modifies the .footnote class.

footnote_font_size

Footnote font size. Defaults to 0.9em. Modifies the .footnote class. Accepts CSS font-size property values.

footnote_position_bottom

Footnote location from bottom of screen. Defaults to 60px. Modifies the .footnote class. Accepts CSS position property values.

left_column_subtle_color

Left Column Text (not last). Defaults to apply_alpha(primary_color, 0.6). Modifies the ⁠.left-column h2, .left-column h3⁠ classes.

left_column_selected_color

Left Column Current Selection. Defaults to primary_color. Modifies the ⁠.left-column h2:last-of-type, .left-column h3:last-child⁠ classes.

blockquote_left_border_color

Blockquote Left Border Color. Defaults to apply_alpha(secondary_color, 0.5). Modifies the blockquote element.

table_border_color

Table top/bottom border. Defaults to #666. Modifies the ⁠table: border-top, border-bottom⁠ elements.

table_row_border_color

Table row inner bottom border. Defaults to #ddd. Modifies the ⁠table thead th: border-bottom⁠ elements.

table_row_even_background_color

Table Even Row Background Color. Defaults to lighten_color(secondary_color, 0.8). Modifies the ⁠thead, tfoot, tr:nth-child(even)⁠ elements.

base_font_size

text_font_size

header_h1_font_size

header_h2_font_size

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. Defaults to FALSE.

header_background_color

header_background_text_color

header_background_padding

Padding for h1 Header with Background. Defaults to NULL. Modifies the ⁠.remark-slide-content h1⁠ class. Accepts CSS padding property values.

header_background_content_padding_top

Top Padding for Content in Slide with Header with Background. Defaults to 7rem. Modifies the .remark-slide-content class.

header_background_ignore_classes

Slide Classes Where Header with Background will not be Applied. Defaults to c('normal', 'inverse', 'title', 'middle', 'bottom'). Modifies the .remark-slide-content class.

text_slide_number_font_size

Slide Number Text Font Size. Defaults to 0.9rem. Modifies the .remark-slide-number class. Accepts CSS font-size property values.

text_font_google

Use google_font() to specify body font. Defaults to NULL. Modifies the body element.

text_font_family

text_font_weight

Body Text Font Weight. Defaults to xaringanthemer_font_default("text_font_weight"). Modifies the body element. Accepts CSS font-weight property values.

text_bold_font_weight

Body Bold Text Font Weight. Defaults to bold. Modifies the strong element.

text_font_url

Body Text Font URL(s). Defaults to xaringanthemer_font_default("text_font_url"). Modifies the ⁠@import url()⁠ elements.

text_font_family_fallback

text_font_base

header_font_google

Use google_font() to specify header font. Defaults to NULL. Modifies the body element.

header_font_family

header_font_weight

Header Font Weight. Defaults to xaringanthemer_font_default("header_font_weight"). Modifies the ⁠h1, h2, h3⁠ elements. Accepts CSS font-weight property values.

header_font_family_fallback

header_font_url

Header Font URL. Defaults to xaringanthemer_font_default("header_font_url"). Modifies the ⁠@import url⁠ elements.

code_font_google

Use google_font() to specify code font. Defaults to NULL. Modifies the body element.

code_font_family

code_font_size

code_font_url

Code Font URL. Defaults to xaringanthemer_font_default("code_font_url"). Modifies the ⁠@import url⁠ elements.

code_font_family_fallback

Code Font Fallback. Defaults to xaringanthemer_font_default("code_font_family_fallback"). Modifies the ⁠.remark-code, .remark-inline-code⁠ classes.

link_decoration

Text decoration of links. Defaults to none. Modifies the ⁠a, a > code⁠ elements. Accepts CSS text-decoration property values.

colors

extra_css

A named list of CSS definitions each containing a named list of CSS property-value pairs, i.e. list(".class-id" = list("css-property" = "value")).

extra_fonts

outfile

Customized xaringan CSS output file name, default is "xaringan-themer.css"

Value

The CSS styles are written to the file path provided in outfile (by default to xaringan-themer.css). If outfile is NULL, the CSS is returned directly as a character string.

Usage

output:
xaringan::moon_reader:
  css: xaringan-themer.css

Examples

# Create a xaringan style in a temporary file
xaringan_themer_css <- tempfile("xaringan-themer-", fileext = ".css")

style_duo_accent(
  primary_color = "#006747",
  secondary_color = "#cfc493",
  outfile = xaringan_themer_css # omit in your slides to write the
                                # styles to xaringan-themer.css
)

# View the CSS:
# file.edit(xaringan_themer_css)

Duotone Accent Inverse Theme

Description

An "inverted" default xaringan theme with a two colors used for color accents on select elements (headers, bold text, etc.).

Usage

style_duo_accent_inverse(
  primary_color = "#035AA6",
  secondary_color = "#03A696",
  white_color = "#FFFFFF",
  black_color = "#000000",
  text_color = white_color,
  header_color = primary_color,
  background_color = black_color,
  link_color = choose_dark_or_light(secondary_color, secondary_color, primary_color),
  text_bold_color = choose_dark_or_light(secondary_color, secondary_color, primary_color),
  text_slide_number_color = primary_color,
  padding = "16px 64px 16px 64px",
  background_image = NULL,
  background_size = NULL,
  background_position = NULL,
  code_highlight_color = "rgba(255,255,0,0.5)",
  code_inline_color = choose_dark_or_light(secondary_color, secondary_color,
    primary_color),
  code_inline_background_color = NULL,
  code_inline_font_size = "1em",
  inverse_background_color = secondary_color,
  inverse_text_color = choose_dark_or_light(secondary_color, black_color, white_color),
  inverse_text_shadow = FALSE,
  inverse_header_color = inverse_text_color,
  inverse_link_color = link_color,
  title_slide_text_color = choose_dark_or_light(primary_color, black_color, white_color),
  title_slide_background_color = primary_color,
  title_slide_background_image = NULL,
  title_slide_background_size = NULL,
  title_slide_background_position = NULL,
  footnote_color = NULL,
  footnote_font_size = "0.9em",
  footnote_position_bottom = "60px",
  left_column_subtle_color = apply_alpha(primary_color, 0.6),
  left_column_selected_color = primary_color,
  blockquote_left_border_color = apply_alpha(secondary_color, 0.5),
  table_border_color = "#666",
  table_row_border_color = "#ddd",
  table_row_even_background_color = darken_color(choose_dark_or_light(primary_color,
    secondary_color, primary_color), 0.2),
  base_font_size = "20px",
  text_font_size = "1rem",
  header_h1_font_size = "2.75rem",
  header_h2_font_size = "2.25rem",
  header_h3_font_size = "1.75rem",
  header_background_auto = FALSE,
  header_background_color = header_color,
  header_background_text_color = background_color,
  header_background_padding = NULL,
  header_background_content_padding_top = "7rem",
  header_background_ignore_classes = c("normal", "inverse", "title", "middle", "bottom"),
  text_slide_number_font_size = "0.9rem",
  text_font_google = NULL,
  text_font_family = xaringanthemer_font_default("text_font_family"),
  text_font_weight = xaringanthemer_font_default("text_font_weight"),
  text_bold_font_weight = "bold",
  text_font_url = xaringanthemer_font_default("text_font_url"),
  text_font_family_fallback = xaringanthemer_font_default("text_font_family_fallback"),
  text_font_base = "sans-serif",
  header_font_google = NULL,
  header_font_family = xaringanthemer_font_default("header_font_family"),
  header_font_weight = xaringanthemer_font_default("header_font_weight"),
  header_font_family_fallback = "Georgia, serif",
  header_font_url = xaringanthemer_font_default("header_font_url"),
  code_font_google = NULL,
  code_font_family = xaringanthemer_font_default("code_font_family"),
  code_font_size = "0.9rem",
  code_font_url = xaringanthemer_font_default("code_font_url"),
  code_font_family_fallback = xaringanthemer_font_default("code_font_family_fallback"),
  link_decoration = "none",
  colors = NULL,
  extra_css = NULL,
  extra_fonts = NULL,
  outfile = "xaringan-themer.css"
)

Arguments

primary_color

secondary_color

white_color

black_color

text_color

Text Color. Defaults to white_color. Modifies the body element. The value of this variable is also stored as a CSS variable that can be referenced with var(--text_color) in any argument of a style function or in custom CSS.

header_color

background_color

Slide Background Color. Defaults to black_color. Modifies the .remark-slide-content class. The value of this variable is also stored as a CSS variable that can be referenced with var(--background-color) in any argument of a style function or in custom CSS.

link_color

Link Color. Defaults to choose_dark_or_light(secondary_color, secondary_color, primary_color). Modifies the ⁠a, a > code⁠ elements. The value of this variable is also stored as a CSS variable that can be referenced with var(--link-color) in any argument of a style function or in custom CSS.

text_bold_color

Bold Text Color. Defaults to choose_dark_or_light(secondary_color, secondary_color, primary_color). Modifies the strong element. The value of this variable is also stored as a CSS variable that can be referenced with var(--text-bold-color) in any argument of a style function or in custom CSS.

text_slide_number_color

Slide Number Color. Defaults to primary_color. Modifies the .remark-slide-number class.

padding

Slide Padding in ⁠top right [bottom left]⁠ format. Defaults to 16px 64px 16px 64px. Modifies the .remark-slide-content class. Accepts CSS padding property values.

background_image

background_size

background_position

code_highlight_color

code_inline_color

Inline Code Color. Defaults to choose_dark_or_light(secondary_color, secondary_color, primary_color). Modifies the .remark-inline-code class.

code_inline_background_color

Inline Code Background Color. Defaults to NULL. Modifies the .remark-inline-code class.

code_inline_font_size

inverse_background_color

inverse_text_color

inverse_text_shadow

Enables Shadow on text of inverse slides. Defaults to FALSE. Modifies the .inverse class.

inverse_header_color

inverse_link_color

title_slide_text_color

title_slide_background_color

title_slide_background_image

Title Slide Background Image URL. Defaults to NULL. Modifies the .title-slide class.

title_slide_background_size

Title Slide Background Image Size, defaults to "cover" if background image is set. Defaults to NULL. Modifies the .title-slide class. Accepts CSS background-size property values.

title_slide_background_position

Title Slide Background Image Position. Defaults to NULL. Modifies the .title-slide class. Accepts CSS background-position property values.

footnote_color

Footnote text color (if NA, then it will be the same color as text_color). Defaults to NULL. Modifies the .footnote class.

footnote_font_size

Footnote font size. Defaults to 0.9em. Modifies the .footnote class. Accepts CSS font-size property values.

footnote_position_bottom

Footnote location from bottom of screen. Defaults to 60px. Modifies the .footnote class. Accepts CSS position property values.

left_column_subtle_color

Left Column Text (not last). Defaults to apply_alpha(primary_color, 0.6). Modifies the ⁠.left-column h2, .left-column h3⁠ classes.

left_column_selected_color

Left Column Current Selection. Defaults to primary_color. Modifies the ⁠.left-column h2:last-of-type, .left-column h3:last-child⁠ classes.

blockquote_left_border_color

Blockquote Left Border Color. Defaults to apply_alpha(secondary_color, 0.5). Modifies the blockquote element.

table_border_color

Table top/bottom border. Defaults to #666. Modifies the ⁠table: border-top, border-bottom⁠ elements.

table_row_border_color

Table row inner bottom border. Defaults to #ddd. Modifies the ⁠table thead th: border-bottom⁠ elements.

table_row_even_background_color

Table Even Row Background Color. Defaults to darken_color(choose_dark_or_light(primary_color, secondary_color, primary_color), 0.2). Modifies the ⁠thead, tfoot, tr:nth-child(even)⁠ elements.

base_font_size

text_font_size

header_h1_font_size

header_h2_font_size

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. Defaults to FALSE.

header_background_color

header_background_text_color

header_background_padding

Padding for h1 Header with Background. Defaults to NULL. Modifies the ⁠.remark-slide-content h1⁠ class. Accepts CSS padding property values.

header_background_content_padding_top

Top Padding for Content in Slide with Header with Background. Defaults to 7rem. Modifies the .remark-slide-content class.

header_background_ignore_classes

Slide Classes Where Header with Background will not be Applied. Defaults to c('normal', 'inverse', 'title', 'middle', 'bottom'). Modifies the .remark-slide-content class.

text_slide_number_font_size

Slide Number Text Font Size. Defaults to 0.9rem. Modifies the .remark-slide-number class. Accepts CSS font-size property values.

text_font_google

Use google_font() to specify body font. Defaults to NULL. Modifies the body element.

text_font_family

text_font_weight

Body Text Font Weight. Defaults to xaringanthemer_font_default("text_font_weight"). Modifies the body element. Accepts CSS font-weight property values.

text_bold_font_weight

Body Bold Text Font Weight. Defaults to bold. Modifies the strong element.

text_font_url

Body Text Font URL(s). Defaults to xaringanthemer_font_default("text_font_url"). Modifies the ⁠@import url()⁠ elements.

text_font_family_fallback

text_font_base

header_font_google

Use google_font() to specify header font. Defaults to NULL. Modifies the body element.

header_font_family

header_font_weight

Header Font Weight. Defaults to xaringanthemer_font_default("header_font_weight"). Modifies the ⁠h1, h2, h3⁠ elements. Accepts CSS font-weight property values.

header_font_family_fallback

header_font_url

Header Font URL. Defaults to xaringanthemer_font_default("header_font_url"). Modifies the ⁠@import url⁠ elements.

code_font_google

Use google_font() to specify code font. Defaults to NULL. Modifies the body element.

code_font_family

code_font_size

code_font_url

Code Font URL. Defaults to xaringanthemer_font_default("code_font_url"). Modifies the ⁠@import url⁠ elements.

code_font_family_fallback

Code Font Fallback. Defaults to xaringanthemer_font_default("code_font_family_fallback"). Modifies the ⁠.remark-code, .remark-inline-code⁠ classes.

link_decoration

Text decoration of links. Defaults to none. Modifies the ⁠a, a > code⁠ elements. Accepts CSS text-decoration property values.

colors

extra_css

A named list of CSS definitions each containing a named list of CSS property-value pairs, i.e. list(".class-id" = list("css-property" = "value")).

extra_fonts

outfile

Customized xaringan CSS output file name, default is "xaringan-themer.css"

Value

The CSS styles are written to the file path provided in outfile (by default to xaringan-themer.css). If outfile is NULL, the CSS is returned directly as a character string.

Usage

output:
xaringan::moon_reader:
  css: xaringan-themer.css

Examples

# Create a xaringan style in a temporary file
xaringan_themer_css <- tempfile("xaringan-themer-", fileext = ".css")

style_duo_accent_inverse(
  primary_color = "#006747",
  secondary_color = "#cfc493",
  outfile = xaringan_themer_css # omit in your slides to write the
                                # styles to xaringan-themer.css
)

# View the CSS:
# file.edit(xaringan_themer_css)

Add Extra CSS Styles

Description

Adds css elements to target outfile, typically a xaringanthemer css file. The css argument takes a list of CSS classes and definitions (see examples below) and appends CSS rules to outfile.

Usage

style_extra_css(
  css,
  outfile = "xaringan-themer.css",
  append = TRUE,
  heading = "Extra CSS"
)

Arguments

css

A named list of CSS definitions each containing a named list of CSS property-value pairs, i.e. list(".class-id" = list("css-property" = "value"))

outfile

Customized xaringan CSS output file name, default is "xaringan-themer.css"

append

If TRUE output will be appended to outfile; otherwise, it will overwrite the contents of outfile.

heading

Heading added above extra CSS. Use NULL to disable.

css list

The css input must be a named list of css properties and values within a named list of class identifiers, for example list(".class-id" = list("css-property" = "value")).

Examples

style_extra_css(
  outfile = stdout(),
  css = list(
    ".red" = list(color = "red"),
    ".small" = list("font-size" = "90%"),
    ".full-width" = list(
      display = "flex",
      width = "100%",
      flex = "1 1 auto"
    )
  )
)

Monotone Accent Theme

Description

The default xaringan theme with a single color used for color accents on select elements (headers, bold text, etc.).

Usage

style_mono_accent(
  base_color = "#43418A",
  white_color = "#FFFFFF",
  black_color = "#272822",
  text_color = black_color,
  header_color = base_color,
  background_color = white_color,
  link_color = base_color,
  text_bold_color = base_color,
  text_slide_number_color = base_color,
  padding = "16px 64px 16px 64px",
  background_image = NULL,
  background_size = NULL,
  background_position = NULL,
  code_highlight_color = "rgba(255,255,0,0.5)",
  code_inline_color = base_color,
  code_inline_background_color = NULL,
  code_inline_font_size = "1em",
  inverse_background_color = base_color,
  inverse_text_color = white_color,
  inverse_text_shadow = FALSE,
  inverse_header_color = inverse_text_color,
  inverse_link_color = link_color,
  title_slide_text_color = inverse_text_color,
  title_slide_background_color = inverse_background_color,
  title_slide_background_image = NULL,
  title_slide_background_size = NULL,
  title_slide_background_position = NULL,
  footnote_color = NULL,
  footnote_font_size = "0.9em",
  footnote_position_bottom = "60px",
  left_column_subtle_color = apply_alpha(base_color, 0.6),
  left_column_selected_color = base_color,
  blockquote_left_border_color = apply_alpha(base_color, 0.5),
  table_border_color = "#666",
  table_row_border_color = "#ddd",
  table_row_even_background_color = lighten_color(base_color, 0.8),
  base_font_size = "20px",
  text_font_size = "1rem",
  header_h1_font_size = "2.75rem",
  header_h2_font_size = "2.25rem",
  header_h3_font_size = "1.75rem",
  header_background_auto = FALSE,
  header_background_color = header_color,
  header_background_text_color = background_color,
  header_background_padding = NULL,
  header_background_content_padding_top = "7rem",
  header_background_ignore_classes = c("normal", "inverse", "title", "middle", "bottom"),
  text_slide_number_font_size = "0.9rem",
  text_font_google = NULL,
  text_font_family = xaringanthemer_font_default("text_font_family"),
  text_font_weight = xaringanthemer_font_default("text_font_weight"),
  text_bold_font_weight = "bold",
  text_font_url = xaringanthemer_font_default("text_font_url"),
  text_font_family_fallback = xaringanthemer_font_default("text_font_family_fallback"),
  text_font_base = "sans-serif",
  header_font_google = NULL,
  header_font_family = xaringanthemer_font_default("header_font_family"),
  header_font_weight = xaringanthemer_font_default("header_font_weight"),
  header_font_family_fallback = "Georgia, serif",
  header_font_url = xaringanthemer_font_default("header_font_url"),
  code_font_google = NULL,
  code_font_family = xaringanthemer_font_default("code_font_family"),
  code_font_size = "0.9rem",
  code_font_url = xaringanthemer_font_default("code_font_url"),
  code_font_family_fallback = xaringanthemer_font_default("code_font_family_fallback"),
  link_decoration = "none",
  colors = NULL,
  extra_css = NULL,
  extra_fonts = NULL,
  outfile = "xaringan-themer.css"
)

Arguments

base_color

Monotone Base Color, works best with a strong color. Defaults to #43418A. Used in multiple CSS rules. The value of this variable is also stored as a CSS variable that can be referenced with var(--base) in any argument of a style function or in custom CSS.

white_color

black_color

Darkest color used. Defaults to #272822. Used in multiple CSS rules. The value of this variable is also stored as a CSS variable that can be referenced with var(--black) in any argument of a style function or in custom CSS.

text_color

header_color

Header Color. Defaults to base_color. Modifies the ⁠h1, h2, h3⁠ elements. The value of this variable is also stored as a CSS variable that can be referenced with var(--header-color) in any argument of a style function or in custom CSS.

background_color

link_color

Link Color. Defaults to base_color. Modifies the ⁠a, a > code⁠ elements. The value of this variable is also stored as a CSS variable that can be referenced with var(--link-color) in any argument of a style function or in custom CSS.

text_bold_color

Bold Text Color. Defaults to base_color. Modifies the strong element. The value of this variable is also stored as a CSS variable that can be referenced with var(--text-bold-color) in any argument of a style function or in custom CSS.

text_slide_number_color

Slide Number Color. Defaults to base_color. Modifies the .remark-slide-number class.

padding

Slide Padding in ⁠top right [bottom left]⁠ format. Defaults to 16px 64px 16px 64px. Modifies the .remark-slide-content class. Accepts CSS padding property values.

background_image

background_size

background_position

code_highlight_color

code_inline_color

Inline Code Color. Defaults to base_color. Modifies the .remark-inline-code class.

code_inline_background_color

Inline Code Background Color. Defaults to NULL. Modifies the .remark-inline-code class.

code_inline_font_size

inverse_background_color

Inverse Background Color. Defaults to base_color. Modifies the .inverse class. The value of this variable is also stored as a CSS variable that can be referenced with var(--inverse-background-color) in any argument of a style function or in custom CSS.

inverse_text_color

Inverse Text Color. Defaults to white_color. Modifies the .inverse class. The value of this variable is also stored as a CSS variable that can be referenced with var(--inverse-text-color) in any argument of a style function or in custom CSS.

inverse_text_shadow

Enables Shadow on text of inverse slides. Defaults to FALSE. Modifies the .inverse class.

inverse_header_color

inverse_link_color

title_slide_text_color

Title Slide Text Color. Defaults to inverse_text_color. Modifies the .title-slide class. The value of this variable is also stored as a CSS variable that can be referenced with var(--title-slide-text-color) in any argument of a style function or in custom CSS.

title_slide_background_color

Title Slide Background Color. Defaults to inverse_background_color. Modifies the .title-slide class. The value of this variable is also stored as a CSS variable that can be referenced with var(--title-slide-background-color) in any argument of a style function or in custom CSS.

title_slide_background_image

Title Slide Background Image URL. Defaults to NULL. Modifies the .title-slide class.

title_slide_background_size

Title Slide Background Image Size, defaults to "cover" if background image is set. Defaults to NULL. Modifies the .title-slide class. Accepts CSS background-size property values.

title_slide_background_position

Title Slide Background Image Position. Defaults to NULL. Modifies the .title-slide class. Accepts CSS background-position property values.

footnote_color

Footnote text color (if NA, then it will be the same color as text_color). Defaults to NULL. Modifies the .footnote class.

footnote_font_size

Footnote font size. Defaults to 0.9em. Modifies the .footnote class. Accepts CSS font-size property values.

footnote_position_bottom

Footnote location from bottom of screen. Defaults to 60px. Modifies the .footnote class. Accepts CSS position property values.

left_column_subtle_color

Left Column Text (not last). Defaults to apply_alpha(base_color, 0.6). Modifies the ⁠.left-column h2, .left-column h3⁠ classes.

left_column_selected_color

Left Column Current Selection. Defaults to base_color. Modifies the ⁠.left-column h2:last-of-type, .left-column h3:last-child⁠ classes.

blockquote_left_border_color

Blockquote Left Border Color. Defaults to apply_alpha(base_color, 0.5). Modifies the blockquote element.

table_border_color

Table top/bottom border. Defaults to #666. Modifies the ⁠table: border-top, border-bottom⁠ elements.

table_row_border_color

Table row inner bottom border. Defaults to #ddd. Modifies the ⁠table thead th: border-bottom⁠ elements.

table_row_even_background_color

Table Even Row Background Color. Defaults to lighten_color(base_color, 0.8). Modifies the ⁠thead, tfoot, tr:nth-child(even)⁠ elements.

base_font_size

text_font_size

header_h1_font_size

header_h2_font_size

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. Defaults to FALSE.

header_background_color

header_background_text_color

header_background_padding

Padding for h1 Header with Background. Defaults to NULL. Modifies the ⁠.remark-slide-content h1⁠ class. Accepts CSS padding property values.

header_background_content_padding_top

Top Padding for Content in Slide with Header with Background. Defaults to 7rem. Modifies the .remark-slide-content class.

header_background_ignore_classes

Slide Classes Where Header with Background will not be Applied. Defaults to c('normal', 'inverse', 'title', 'middle', 'bottom'). Modifies the .remark-slide-content class.

text_slide_number_font_size

Slide Number Text Font Size. Defaults to 0.9rem. Modifies the .remark-slide-number class. Accepts CSS font-size property values.

text_font_google

Use google_font() to specify body font. Defaults to NULL. Modifies the body element.

text_font_family

text_font_weight

Body Text Font Weight. Defaults to xaringanthemer_font_default("text_font_weight"). Modifies the body element. Accepts CSS font-weight property values.

text_bold_font_weight

Body Bold Text Font Weight. Defaults to bold. Modifies the strong element.

text_font_url

Body Text Font URL(s). Defaults to xaringanthemer_font_default("text_font_url"). Modifies the ⁠@import url()⁠ elements.

text_font_family_fallback

text_font_base

header_font_google

Use google_font() to specify header font. Defaults to NULL. Modifies the body element.

header_font_family

header_font_weight

Header Font Weight. Defaults to xaringanthemer_font_default("header_font_weight"). Modifies the ⁠h1, h2, h3⁠ elements. Accepts CSS font-weight property values.

header_font_family_fallback

header_font_url

Header Font URL. Defaults to xaringanthemer_font_default("header_font_url"). Modifies the ⁠@import url⁠ elements.

code_font_google

Use google_font() to specify code font. Defaults to NULL. Modifies the body element.

code_font_family

code_font_size

code_font_url

Code Font URL. Defaults to xaringanthemer_font_default("code_font_url"). Modifies the ⁠@import url⁠ elements.

code_font_family_fallback

Code Font Fallback. Defaults to xaringanthemer_font_default("code_font_family_fallback"). Modifies the ⁠.remark-code, .remark-inline-code⁠ classes.

link_decoration

Text decoration of links. Defaults to none. Modifies the ⁠a, a > code⁠ elements. Accepts CSS text-decoration property values.

colors

extra_css

A named list of CSS definitions each containing a named list of CSS property-value pairs, i.e. list(".class-id" = list("css-property" = "value")).

extra_fonts

outfile

Customized xaringan CSS output file name, default is "xaringan-themer.css"

Value

The CSS styles are written to the file path provided in outfile (by default to xaringan-themer.css). If outfile is NULL, the CSS is returned directly as a character string.

Usage

output:
xaringan::moon_reader:
  css: xaringan-themer.css

Examples

# Create a xaringan style in a temporary file
xaringan_themer_css <- tempfile("xaringan-themer-", fileext = ".css")

style_mono_accent(
  base_color = "#43418A",
  outfile = xaringan_themer_css # omit in your slides to write the
                                # styles to xaringan-themer.css
)

# View the CSS:
# file.edit(xaringan_themer_css)

Monotone Accent Inverse Theme

Description

An "inverted" default xaringan theme with a single color used for color accents on select elements (headers, bold text, etc.).

Usage

style_mono_accent_inverse(
  base_color = "#3C989E",
  white_color = "#FFFFFF",
  black_color = darken_color(base_color, 0.9),
  text_color = white_color,
  header_color = base_color,
  background_color = black_color,
  link_color = base_color,
  text_bold_color = base_color,
  text_slide_number_color = base_color,
  padding = "16px 64px 16px 64px",
  background_image = NULL,
  background_size = NULL,
  background_position = NULL,
  code_highlight_color = "rgba(255,255,0,0.5)",
  code_inline_color = base_color,
  code_inline_background_color = NULL,
  code_inline_font_size = "1em",
  inverse_background_color = base_color,
  inverse_text_color = black_color,
  inverse_text_shadow = FALSE,
  inverse_header_color = inverse_text_color,
  inverse_link_color = link_color,
  title_slide_text_color = inverse_text_color,
  title_slide_background_color = inverse_background_color,
  title_slide_background_image = NULL,
  title_slide_background_size = NULL,
  title_slide_background_position = NULL,
  footnote_color = NULL,
  footnote_font_size = "0.9em",
  footnote_position_bottom = "60px",
  left_column_subtle_color = apply_alpha(base_color, 0.6),
  left_column_selected_color = base_color,
  blockquote_left_border_color = apply_alpha(base_color, 0.5),
  table_border_color = "#666",
  table_row_border_color = "#ddd",
  table_row_even_background_color = darken_color(base_color, 0.8),
  base_font_size = "20px",
  text_font_size = "1rem",
  header_h1_font_size = "2.75rem",
  header_h2_font_size = "2.25rem",
  header_h3_font_size = "1.75rem",
  header_background_auto = FALSE,
  header_background_color = header_color,
  header_background_text_color = background_color,
  header_background_padding = NULL,
  header_background_content_padding_top = "7rem",
  header_background_ignore_classes = c("normal", "inverse", "title", "middle", "bottom"),
  text_slide_number_font_size = "0.9rem",
  text_font_google = NULL,
  text_font_family = xaringanthemer_font_default("text_font_family"),
  text_font_weight = xaringanthemer_font_default("text_font_weight"),
  text_bold_font_weight = "bold",
  text_font_url = xaringanthemer_font_default("text_font_url"),
  text_font_family_fallback = xaringanthemer_font_default("text_font_family_fallback"),
  text_font_base = "sans-serif",
  header_font_google = NULL,
  header_font_family = xaringanthemer_font_default("header_font_family"),
  header_font_weight = xaringanthemer_font_default("header_font_weight"),
  header_font_family_fallback = "Georgia, serif",
  header_font_url = xaringanthemer_font_default("header_font_url"),
  code_font_google = NULL,
  code_font_family = xaringanthemer_font_default("code_font_family"),
  code_font_size = "0.9rem",
  code_font_url = xaringanthemer_font_default("code_font_url"),
  code_font_family_fallback = xaringanthemer_font_default("code_font_family_fallback"),
  link_decoration = "none",
  colors = NULL,
  extra_css = NULL,
  extra_fonts = NULL,
  outfile = "xaringan-themer.css"
)

Arguments

base_color

Monotone Base Color, works best with a light color. Defaults to #3C989E. Used in multiple CSS rules. The value of this variable is also stored as a CSS variable that can be referenced with var(--base) in any argument of a style function or in custom CSS.

white_color

Brightest color used, default is a very light version of base_color. Defaults to #FFFFFF. Used in multiple CSS rules. The value of this variable is also stored as a CSS variable that can be referenced with var(--white) in any argument of a style function or in custom CSS.

black_color

Darkest color used, default is a very dark, version of base_color. Defaults to darken_color(base_color, 0.9). Used in multiple CSS rules. The value of this variable is also stored as a CSS variable that can be referenced with var(--black) in any argument of a style function or in custom CSS.

text_color

header_color

background_color

link_color

text_bold_color

text_slide_number_color

Slide Number Color. Defaults to base_color. Modifies the .remark-slide-number class.

padding

Slide Padding in ⁠top right [bottom left]⁠ format. Defaults to 16px 64px 16px 64px. Modifies the .remark-slide-content class. Accepts CSS padding property values.

background_image

background_size

background_position

code_highlight_color

code_inline_color

Inline Code Color. Defaults to base_color. Modifies the .remark-inline-code class.

code_inline_background_color

Inline Code Background Color. Defaults to NULL. Modifies the .remark-inline-code class.

code_inline_font_size

inverse_background_color

inverse_text_color

Inverse Text Color. Defaults to black_color. Modifies the .inverse class. The value of this variable is also stored as a CSS variable that can be referenced with var(--inverse-text-color) in any argument of a style function or in custom CSS.

inverse_text_shadow

Enables Shadow on text of inverse slides. Defaults to FALSE. Modifies the .inverse class.

inverse_header_color

inverse_link_color

title_slide_text_color

title_slide_background_color

title_slide_background_image

Title Slide Background Image URL. Defaults to NULL. Modifies the .title-slide class.

title_slide_background_size

Title Slide Background Image Size, defaults to "cover" if background image is set. Defaults to NULL. Modifies the .title-slide class. Accepts CSS background-size property values.

title_slide_background_position

Title Slide Background Image Position. Defaults to NULL. Modifies the .title-slide class. Accepts CSS background-position property values.

footnote_color

Footnote text color (if NA, then it will be the same color as text_color). Defaults to NULL. Modifies the .footnote class.

footnote_font_size

Footnote font size. Defaults to 0.9em. Modifies the .footnote class. Accepts CSS font-size property values.

footnote_position_bottom

Footnote location from bottom of screen. Defaults to 60px. Modifies the .footnote class. Accepts CSS position property values.

left_column_subtle_color

Left Column Text (not last). Defaults to apply_alpha(base_color, 0.6). Modifies the ⁠.left-column h2, .left-column h3⁠ classes.

left_column_selected_color

Left Column Current Selection. Defaults to base_color. Modifies the ⁠.left-column h2:last-of-type, .left-column h3:last-child⁠ classes.

blockquote_left_border_color

Blockquote Left Border Color. Defaults to apply_alpha(base_color, 0.5). Modifies the blockquote element.

table_border_color

Table top/bottom border. Defaults to #666. Modifies the ⁠table: border-top, border-bottom⁠ elements.

table_row_border_color

Table row inner bottom border. Defaults to #ddd. Modifies the ⁠table thead th: border-bottom⁠ elements.

table_row_even_background_color

Table Even Row Background Color. Defaults to darken_color(base_color, 0.8). Modifies the ⁠thead, tfoot, tr:nth-child(even)⁠ elements.

base_font_size

text_font_size

header_h1_font_size

header_h2_font_size

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. Defaults to FALSE.

header_background_color

header_background_text_color

header_background_padding

Padding for h1 Header with Background. Defaults to NULL. Modifies the ⁠.remark-slide-content h1⁠ class. Accepts CSS padding property values.

header_background_content_padding_top

Top Padding for Content in Slide with Header with Background. Defaults to 7rem. Modifies the .remark-slide-content class.

header_background_ignore_classes

Slide Classes Where Header with Background will not be Applied. Defaults to c('normal', 'inverse', 'title', 'middle', 'bottom'). Modifies the .remark-slide-content class.

text_slide_number_font_size

Slide Number Text Font Size. Defaults to 0.9rem. Modifies the .remark-slide-number class. Accepts CSS font-size property values.

text_font_google

Use google_font() to specify body font. Defaults to NULL. Modifies the body element.

text_font_family

text_font_weight

Body Text Font Weight. Defaults to xaringanthemer_font_default("text_font_weight"). Modifies the body element. Accepts CSS font-weight property values.

text_bold_font_weight

Body Bold Text Font Weight. Defaults to bold. Modifies the strong element.

text_font_url

Body Text Font URL(s). Defaults to xaringanthemer_font_default("text_font_url"). Modifies the ⁠@import url()⁠ elements.

text_font_family_fallback

text_font_base

header_font_google

Use google_font() to specify header font. Defaults to NULL. Modifies the body element.

header_font_family

header_font_weight

Header Font Weight. Defaults to xaringanthemer_font_default("header_font_weight"). Modifies the ⁠h1, h2, h3⁠ elements. Accepts CSS font-weight property values.

header_font_family_fallback

header_font_url

Header Font URL. Defaults to xaringanthemer_font_default("header_font_url"). Modifies the ⁠@import url⁠ elements.

code_font_google

Use google_font() to specify code font. Defaults to NULL. Modifies the body element.

code_font_family

code_font_size

code_font_url

Code Font URL. Defaults to xaringanthemer_font_default("code_font_url"). Modifies the ⁠@import url⁠ elements.

code_font_family_fallback

Code Font Fallback. Defaults to xaringanthemer_font_default("code_font_family_fallback"). Modifies the ⁠.remark-code, .remark-inline-code⁠ classes.

link_decoration

Text decoration of links. Defaults to none. Modifies the ⁠a, a > code⁠ elements. Accepts CSS text-decoration property values.

colors

extra_css

A named list of CSS definitions each containing a named list of CSS property-value pairs, i.e. list(".class-id" = list("css-property" = "value")).

extra_fonts

outfile

Customized xaringan CSS output file name, default is "xaringan-themer.css"

Value

The CSS styles are written to the file path provided in outfile (by default to xaringan-themer.css). If outfile is NULL, the CSS is returned directly as a character string.

Usage

output:
xaringan::moon_reader:
  css: xaringan-themer.css

Examples

# Create a xaringan style in a temporary file
xaringan_themer_css <- tempfile("xaringan-themer-", fileext = ".css")

style_mono_accent_inverse(
  base_color = "#3c989e",
  outfile = xaringan_themer_css # omit in your slides to write the
                                # styles to xaringan-themer.css
)

# View the CSS:
# file.edit(xaringan_themer_css)

Monotone Dark Theme

Description

A dark monotone theme based around a single color.

Usage

style_mono_dark(
  base_color = "#cbf7ed",
  white_color = lighten_color(base_color, 0.8),
  black_color = darken_color(base_color, 0.85),
  text_color = white_color,
  header_color = base_color,
  background_color = black_color,
  link_color = base_color,
  text_bold_color = base_color,
  text_slide_number_color = base_color,
  padding = "16px 64px 16px 64px",
  background_image = NULL,
  background_size = NULL,
  background_position = NULL,
  code_highlight_color = "rgba(255,255,0,0.5)",
  code_inline_color = base_color,
  code_inline_background_color = NULL,
  code_inline_font_size = "1em",
  inverse_background_color = base_color,
  inverse_text_color = black_color,
  inverse_text_shadow = FALSE,
  inverse_header_color = inverse_text_color,
  inverse_link_color = link_color,
  title_slide_text_color = inverse_text_color,
  title_slide_background_color = inverse_background_color,
  title_slide_background_image = NULL,
  title_slide_background_size = NULL,
  title_slide_background_position = NULL,
  footnote_color = NULL,
  footnote_font_size = "0.9em",
  footnote_position_bottom = "60px",
  left_column_subtle_color = apply_alpha(base_color, 0.6),
  left_column_selected_color = base_color,
  blockquote_left_border_color = apply_alpha(base_color, 0.5),
  table_border_color = "#666",
  table_row_border_color = "#ddd",
  table_row_even_background_color = darken_color(base_color, 0.7),
  base_font_size = "20px",
  text_font_size = "1rem",
  header_h1_font_size = "2.75rem",
  header_h2_font_size = "2.25rem",
  header_h3_font_size = "1.75rem",
  header_background_auto = FALSE,
  header_background_color = header_color,
  header_background_text_color = background_color,
  header_background_padding = NULL,
  header_background_content_padding_top = "7rem",
  header_background_ignore_classes = c("normal", "inverse", "title", "middle", "bottom"),
  text_slide_number_font_size = "0.9rem",
  text_font_google = NULL,
  text_font_family = xaringanthemer_font_default("text_font_family"),
  text_font_weight = xaringanthemer_font_default("text_font_weight"),
  text_bold_font_weight = "bold",
  text_font_url = xaringanthemer_font_default("text_font_url"),
  text_font_family_fallback = xaringanthemer_font_default("text_font_family_fallback"),
  text_font_base = "sans-serif",
  header_font_google = NULL,
  header_font_family = xaringanthemer_font_default("header_font_family"),
  header_font_weight = xaringanthemer_font_default("header_font_weight"),
  header_font_family_fallback = "Georgia, serif",
  header_font_url = xaringanthemer_font_default("header_font_url"),
  code_font_google = NULL,
  code_font_family = xaringanthemer_font_default("code_font_family"),
  code_font_size = "0.9rem",
  code_font_url = xaringanthemer_font_default("code_font_url"),
  code_font_family_fallback = xaringanthemer_font_default("code_font_family_fallback"),
  link_decoration = "none",
  colors = NULL,
  extra_css = NULL,
  extra_fonts = NULL,
  outfile = "xaringan-themer.css"
)

Arguments

base_color

Monotone Base Color, works best with a light color.. Defaults to #cbf7ed. Used in multiple CSS rules. The value of this variable is also stored as a CSS variable that can be referenced with var(--base) in any argument of a style function or in custom CSS.

white_color

Brightest color used, default is a very light version of base_color. Defaults to lighten_color(base_color, 0.8). Used in multiple CSS rules. The value of this variable is also stored as a CSS variable that can be referenced with var(--white) in any argument of a style function or in custom CSS.

black_color

Darkest color used, default is a very dark, version of base_color. Defaults to darken_color(base_color, 0.85). Used in multiple CSS rules. The value of this variable is also stored as a CSS variable that can be referenced with var(--black) in any argument of a style function or in custom CSS.

text_color

header_color

background_color

link_color

text_bold_color

text_slide_number_color

Slide Number Color. Defaults to base_color. Modifies the .remark-slide-number class.

padding

Slide Padding in ⁠top right [bottom left]⁠ format. Defaults to 16px 64px 16px 64px. Modifies the .remark-slide-content class. Accepts CSS padding property values.

background_image

background_size

background_position

code_highlight_color

code_inline_color

Inline Code Color. Defaults to base_color. Modifies the .remark-inline-code class.

code_inline_background_color

Inline Code Background Color. Defaults to NULL. Modifies the .remark-inline-code class.

code_inline_font_size

inverse_background_color

inverse_text_color

inverse_text_shadow

Enables Shadow on text of inverse slides. Defaults to FALSE. Modifies the .inverse class.

inverse_header_color

inverse_link_color

title_slide_text_color

title_slide_background_color

title_slide_background_image

Title Slide Background Image URL. Defaults to NULL. Modifies the .title-slide class.

title_slide_background_size

Title Slide Background Image Size, defaults to "cover" if background image is set. Defaults to NULL. Modifies the .title-slide class. Accepts CSS background-size property values.

title_slide_background_position

Title Slide Background Image Position. Defaults to NULL. Modifies the .title-slide class. Accepts CSS background-position property values.

footnote_color

Footnote text color (if NA, then it will be the same color as text_color). Defaults to NULL. Modifies the .footnote class.

footnote_font_size

Footnote font size. Defaults to 0.9em. Modifies the .footnote class. Accepts CSS font-size property values.

footnote_position_bottom

Footnote location from bottom of screen. Defaults to 60px. Modifies the .footnote class. Accepts CSS position property values.

left_column_subtle_color

Left Column Text (not last). Defaults to apply_alpha(base_color, 0.6). Modifies the ⁠.left-column h2, .left-column h3⁠ classes.

left_column_selected_color

Left Column Current Selection. Defaults to base_color. Modifies the ⁠.left-column h2:last-of-type, .left-column h3:last-child⁠ classes.

blockquote_left_border_color

Blockquote Left Border Color. Defaults to apply_alpha(base_color, 0.5). Modifies the blockquote element.

table_border_color

Table top/bottom border. Defaults to #666. Modifies the ⁠table: border-top, border-bottom⁠ elements.

table_row_border_color

Table row inner bottom border. Defaults to #ddd. Modifies the ⁠table thead th: border-bottom⁠ elements.

table_row_even_background_color

Table Even Row Background Color. Defaults to darken_color(base_color, 0.7). Modifies the ⁠thead, tfoot, tr:nth-child(even)⁠ elements.

base_font_size

text_font_size

header_h1_font_size

header_h2_font_size

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. Defaults to FALSE.

header_background_color

header_background_text_color

header_background_padding

Padding for h1 Header with Background. Defaults to NULL. Modifies the ⁠.remark-slide-content h1⁠ class. Accepts CSS padding property values.

header_background_content_padding_top

Top Padding for Content in Slide with Header with Background. Defaults to 7rem. Modifies the .remark-slide-content class.

header_background_ignore_classes

Slide Classes Where Header with Background will not be Applied. Defaults to c('normal', 'inverse', 'title', 'middle', 'bottom'). Modifies the .remark-slide-content class.

text_slide_number_font_size

Slide Number Text Font Size. Defaults to 0.9rem. Modifies the .remark-slide-number class. Accepts CSS font-size property values.

text_font_google

Use google_font() to specify body font. Defaults to NULL. Modifies the body element.

text_font_family

text_font_weight

Body Text Font Weight. Defaults to xaringanthemer_font_default("text_font_weight"). Modifies the body element. Accepts CSS font-weight property values.

text_bold_font_weight

Body Bold Text Font Weight. Defaults to bold. Modifies the strong element.

text_font_url

Body Text Font URL(s). Defaults to xaringanthemer_font_default("text_font_url"). Modifies the ⁠@import url()⁠ elements.

text_font_family_fallback

text_font_base

header_font_google

Use google_font() to specify header font. Defaults to NULL. Modifies the body element.

header_font_family

header_font_weight

Header Font Weight. Defaults to xaringanthemer_font_default("header_font_weight"). Modifies the ⁠h1, h2, h3⁠ elements. Accepts CSS font-weight property values.

header_font_family_fallback

header_font_url

Header Font URL. Defaults to xaringanthemer_font_default("header_font_url"). Modifies the ⁠@import url⁠ elements.

code_font_google

Use google_font() to specify code font. Defaults to NULL. Modifies the body element.

code_font_family

code_font_size

code_font_url

Code Font URL. Defaults to xaringanthemer_font_default("code_font_url"). Modifies the ⁠@import url⁠ elements.

code_font_family_fallback

Code Font Fallback. Defaults to xaringanthemer_font_default("code_font_family_fallback"). Modifies the ⁠.remark-code, .remark-inline-code⁠ classes.

link_decoration

Text decoration of links. Defaults to none. Modifies the ⁠a, a > code⁠ elements. Accepts CSS text-decoration property values.

colors

extra_css

A named list of CSS definitions each containing a named list of CSS property-value pairs, i.e. list(".class-id" = list("css-property" = "value")).

extra_fonts

outfile

Customized xaringan CSS output file name, default is "xaringan-themer.css"

Value

The CSS styles are written to the file path provided in outfile (by default to xaringan-themer.css). If outfile is NULL, the CSS is returned directly as a character string.

Usage

output:
xaringan::moon_reader:
  css: xaringan-themer.css

Examples

# Create a xaringan style in a temporary file
xaringan_themer_css <- tempfile("xaringan-themer-", fileext = ".css")

style_mono_dark(
  base_color = "#cbf7ed",
  outfile = xaringan_themer_css # omit in your slides to write the
                                # styles to xaringan-themer.css
)

# View the CSS:
# file.edit(xaringan_themer_css)

Monotone Light Theme

Description

A light monotone theme based around a single color.

Usage

style_mono_light(
  base_color = "#23395b",
  white_color = lighten_color(base_color, 0.9),
  black_color = darken_color(base_color, 0.3),
  text_color = black_color,
  header_color = base_color,
  background_color = white_color,
  link_color = base_color,
  text_bold_color = base_color,
  text_slide_number_color = base_color,
  padding = "16px 64px 16px 64px",
  background_image = NULL,
  background_size = NULL,
  background_position = NULL,
  code_highlight_color = "rgba(255,255,0,0.5)",
  code_inline_color = base_color,
  code_inline_background_color = NULL,
  code_inline_font_size = "1em",
  inverse_background_color = base_color,
  inverse_text_color = white_color,
  inverse_text_shadow = FALSE,
  inverse_header_color = inverse_text_color,
  inverse_link_color = link_color,
  title_slide_text_color = inverse_text_color,
  title_slide_background_color = inverse_background_color,
  title_slide_background_image = NULL,
  title_slide_background_size = NULL,
  title_slide_background_position = NULL,
  footnote_color = NULL,
  footnote_font_size = "0.9em",
  footnote_position_bottom = "60px",
  left_column_subtle_color = apply_alpha(base_color, 0.6),
  left_column_selected_color = base_color,
  blockquote_left_border_color = apply_alpha(base_color, 0.5),
  table_border_color = "#666",
  table_row_border_color = "#ddd",
  table_row_even_background_color = lighten_color(base_color, 0.8),
  base_font_size = "20px",
  text_font_size = "1rem",
  header_h1_font_size = "2.75rem",
  header_h2_font_size = "2.25rem",
  header_h3_font_size = "1.75rem",
  header_background_auto = FALSE,
  header_background_color = header_color,
  header_background_text_color = background_color,
  header_background_padding = NULL,
  header_background_content_padding_top = "7rem",
  header_background_ignore_classes = c("normal", "inverse", "title", "middle", "bottom"),
  text_slide_number_font_size = "0.9rem",
  text_font_google = NULL,
  text_font_family = xaringanthemer_font_default("text_font_family"),
  text_font_weight = xaringanthemer_font_default("text_font_weight"),
  text_bold_font_weight = "bold",
  text_font_url = xaringanthemer_font_default("text_font_url"),
  text_font_family_fallback = xaringanthemer_font_default("text_font_family_fallback"),
  text_font_base = "sans-serif",
  header_font_google = NULL,
  header_font_family = xaringanthemer_font_default("header_font_family"),
  header_font_weight = xaringanthemer_font_default("header_font_weight"),
  header_font_family_fallback = "Georgia, serif",
  header_font_url = xaringanthemer_font_default("header_font_url"),
  code_font_google = NULL,
  code_font_family = xaringanthemer_font_default("code_font_family"),
  code_font_size = "0.9rem",
  code_font_url = xaringanthemer_font_default("code_font_url"),
  code_font_family_fallback = xaringanthemer_font_default("code_font_family_fallback"),
  link_decoration = "none",
  colors = NULL,
  extra_css = NULL,
  extra_fonts = NULL,
  outfile = "xaringan-themer.css"
)

Arguments

base_color

Monotone base color, works best with a strong color. Defaults to #23395b. Used in multiple CSS rules. The value of this variable is also stored as a CSS variable that can be referenced with var(--base) in any argument of a style function or in custom CSS.

white_color

Brightest color used, default is a very light version of base_color. Defaults to lighten_color(base_color, 0.9). Used in multiple CSS rules. The value of this variable is also stored as a CSS variable that can be referenced with var(--white) in any argument of a style function or in custom CSS.

black_color

Darkest color used, default is a very dark, version of base_color. Defaults to darken_color(base_color, 0.3). Used in multiple CSS rules. The value of this variable is also stored as a CSS variable that can be referenced with var(--black) in any argument of a style function or in custom CSS.

text_color

header_color

background_color

link_color

text_bold_color

text_slide_number_color

Slide Number Color. Defaults to base_color. Modifies the .remark-slide-number class.

padding

Slide Padding in ⁠top right [bottom left]⁠ format. Defaults to 16px 64px 16px 64px. Modifies the .remark-slide-content class. Accepts CSS padding property values.

background_image

background_size

background_position

code_highlight_color

code_inline_color

Inline Code Color. Defaults to base_color. Modifies the .remark-inline-code class.

code_inline_background_color

Inline Code Background Color. Defaults to NULL. Modifies the .remark-inline-code class.

code_inline_font_size

inverse_background_color

inverse_text_color

inverse_text_shadow

Enables Shadow on text of inverse slides. Defaults to FALSE. Modifies the .inverse class.

inverse_header_color

inverse_link_color

title_slide_text_color

title_slide_background_color

title_slide_background_image

Title Slide Background Image URL. Defaults to NULL. Modifies the .title-slide class.

title_slide_background_size

Title Slide Background Image Size, defaults to "cover" if background image is set. Defaults to NULL. Modifies the .title-slide class. Accepts CSS background-size property values.

title_slide_background_position

Title Slide Background Image Position. Defaults to NULL. Modifies the .title-slide class. Accepts CSS background-position property values.

footnote_color

Footnote text color (if NA, then it will be the same color as text_color). Defaults to NULL. Modifies the .footnote class.

footnote_font_size

Footnote font size. Defaults to 0.9em. Modifies the .footnote class. Accepts CSS font-size property values.

footnote_position_bottom

Footnote location from bottom of screen. Defaults to 60px. Modifies the .footnote class. Accepts CSS position property values.

left_column_subtle_color

Left Column Text (not last). Defaults to apply_alpha(base_color, 0.6). Modifies the ⁠.left-column h2, .left-column h3⁠ classes.

left_column_selected_color

Left Column Current Selection. Defaults to base_color. Modifies the ⁠.left-column h2:last-of-type, .left-column h3:last-child⁠ classes.

blockquote_left_border_color

Blockquote Left Border Color. Defaults to apply_alpha(base_color, 0.5). Modifies the blockquote element.

table_border_color

Table top/bottom border. Defaults to #666. Modifies the ⁠table: border-top, border-bottom⁠ elements.

table_row_border_color

Table row inner bottom border. Defaults to #ddd. Modifies the ⁠table thead th: border-bottom⁠ elements.

table_row_even_background_color

Table Even Row Background Color. Defaults to lighten_color(base_color, 0.8). Modifies the ⁠thead, tfoot, tr:nth-child(even)⁠ elements.

base_font_size

text_font_size

header_h1_font_size

header_h2_font_size

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. Defaults to FALSE.

header_background_color

header_background_text_color

header_background_padding

Padding for h1 Header with Background. Defaults to NULL. Modifies the ⁠.remark-slide-content h1⁠ class. Accepts CSS padding property values.

header_background_content_padding_top

Top Padding for Content in Slide with Header with Background. Defaults to 7rem. Modifies the .remark-slide-content class.

header_background_ignore_classes

Slide Classes Where Header with Background will not be Applied. Defaults to c('normal', 'inverse', 'title', 'middle', 'bottom'). Modifies the .remark-slide-content class.

text_slide_number_font_size

Slide Number Text Font Size. Defaults to 0.9rem. Modifies the .remark-slide-number class. Accepts CSS font-size property values.

text_font_google

Use google_font() to specify body font. Defaults to NULL. Modifies the body element.

text_font_family

text_font_weight

Body Text Font Weight. Defaults to xaringanthemer_font_default("text_font_weight"). Modifies the body element. Accepts CSS font-weight property values.

text_bold_font_weight

Body Bold Text Font Weight. Defaults to bold. Modifies the strong element.

text_font_url

Body Text Font URL(s). Defaults to xaringanthemer_font_default("text_font_url"). Modifies the ⁠@import url()⁠ elements.

text_font_family_fallback

text_font_base

header_font_google

Use google_font() to specify header font. Defaults to NULL. Modifies the body element.

header_font_family

header_font_weight

Header Font Weight. Defaults to xaringanthemer_font_default("header_font_weight"). Modifies the ⁠h1, h2, h3⁠ elements. Accepts CSS font-weight property values.

header_font_family_fallback

header_font_url

Header Font URL. Defaults to xaringanthemer_font_default("header_font_url"). Modifies the ⁠@import url⁠ elements.

code_font_google

Use google_font() to specify code font. Defaults to NULL. Modifies the body element.

code_font_family

code_font_size

code_font_url

Code Font URL. Defaults to xaringanthemer_font_default("code_font_url"). Modifies the ⁠@import url⁠ elements.

code_font_family_fallback

Code Font Fallback. Defaults to xaringanthemer_font_default("code_font_family_fallback"). Modifies the ⁠.remark-code, .remark-inline-code⁠ classes.

link_decoration

Text decoration of links. Defaults to none. Modifies the ⁠a, a > code⁠ elements. Accepts CSS text-decoration property values.

colors

extra_css

A named list of CSS definitions each containing a named list of CSS property-value pairs, i.e. list(".class-id" = list("css-property" = "value")).

extra_fonts

outfile

Customized xaringan CSS output file name, default is "xaringan-themer.css"

Value

The CSS styles are written to the file path provided in outfile (by default to xaringan-themer.css). If outfile is NULL, the CSS is returned directly as a character string.

Usage

output:
xaringan::moon_reader:
  css: xaringan-themer.css

Examples

# Create a xaringan style in a temporary file
xaringan_themer_css <- tempfile("xaringan-themer-", fileext = ".css")

style_mono_light(
  base_color = "#23395b",
  outfile = xaringan_themer_css # omit in your slides to write the
                                # styles to xaringan-themer.css
)

# View the CSS:
# file.edit(xaringan_themer_css)

Solarized Dark Theme

Description

A dark theme based around on the solarized color scheme. Works well with "highlightStyle: solarized-dark" or "highlighStyle: solarized-light".

Usage

style_solarized_dark(
  text_color = "#839496",
  header_color = "#dc322f",
  background_color = "#002b36",
  link_color = "#b58900",
  text_bold_color = "#d33682",
  text_slide_number_color = "#586e75",
  padding = "16px 64px 16px 64px",
  background_image = NULL,
  background_size = NULL,
  background_position = NULL,
  code_highlight_color = "#268bd240",
  code_inline_color = "#6c71c4",
  code_inline_background_color = NULL,
  code_inline_font_size = "1em",
  inverse_background_color = "#fdf6e3",
  inverse_text_color = "#002b36",
  inverse_text_shadow = FALSE,
  inverse_header_color = inverse_text_color,
  inverse_link_color = link_color,
  title_slide_text_color = inverse_text_color,
  title_slide_background_color = inverse_background_color,
  title_slide_background_image = NULL,
  title_slide_background_size = NULL,
  title_slide_background_position = NULL,
  footnote_color = NULL,
  footnote_font_size = "0.9em",
  footnote_position_bottom = "60px",
  left_column_subtle_color = "#586e75",
  left_column_selected_color = "#93a1a1",
  blockquote_left_border_color = "#cb4b16",
  table_border_color = "#657b83",
  table_row_border_color = "#657b83",
  table_row_even_background_color = "#073642",
  base_font_size = "20px",
  text_font_size = "1rem",
  header_h1_font_size = "2.75rem",
  header_h2_font_size = "2.25rem",
  header_h3_font_size = "1.75rem",
  header_background_auto = FALSE,
  header_background_color = header_color,
  header_background_text_color = background_color,
  header_background_padding = NULL,
  header_background_content_padding_top = "7rem",
  header_background_ignore_classes = c("normal", "inverse", "title", "middle", "bottom"),
  text_slide_number_font_size = "0.9rem",
  text_font_google = NULL,
  text_font_family = xaringanthemer_font_default("text_font_family"),
  text_font_weight = xaringanthemer_font_default("text_font_weight"),
  text_bold_font_weight = "bold",
  text_font_url = xaringanthemer_font_default("text_font_url"),
  text_font_family_fallback = xaringanthemer_font_default("text_font_family_fallback"),
  text_font_base = "sans-serif",
  header_font_google = NULL,
  header_font_family = xaringanthemer_font_default("header_font_family"),
  header_font_weight = xaringanthemer_font_default("header_font_weight"),
  header_font_family_fallback = "Georgia, serif",
  header_font_url = xaringanthemer_font_default("header_font_url"),
  code_font_google = NULL,
  code_font_family = xaringanthemer_font_default("code_font_family"),
  code_font_size = "0.9rem",
  code_font_url = xaringanthemer_font_default("code_font_url"),
  code_font_family_fallback = xaringanthemer_font_default("code_font_family_fallback"),
  link_decoration = "none",
  colors = NULL,
  extra_css = NULL,
  extra_fonts = NULL,
  outfile = "xaringan-themer.css"
)

Arguments

text_color

Text Color. Defaults to #839496. Modifies the body element. The value of this variable is also stored as a CSS variable that can be referenced with var(--text_color) in any argument of a style function or in custom CSS.

header_color

Header Color. Defaults to #dc322f. Modifies the ⁠h1, h2, h3⁠ elements. The value of this variable is also stored as a CSS variable that can be referenced with var(--header-color) in any argument of a style function or in custom CSS.

background_color

Slide Background Color. Defaults to #002b36. Modifies the .remark-slide-content class. The value of this variable is also stored as a CSS variable that can be referenced with var(--background-color) in any argument of a style function or in custom CSS.

link_color

Link Color. Defaults to #b58900. Modifies the ⁠a, a > code⁠ elements. The value of this variable is also stored as a CSS variable that can be referenced with var(--link-color) in any argument of a style function or in custom CSS.

text_bold_color

Bold Text Color. Defaults to #d33682. Modifies the strong element. The value of this variable is also stored as a CSS variable that can be referenced with var(--text-bold-color) in any argument of a style function or in custom CSS.

text_slide_number_color

Slide Number Color. Defaults to #586e75. Modifies the .remark-slide-number class.

padding

Slide Padding in ⁠top right [bottom left]⁠ format. Defaults to 16px 64px 16px 64px. Modifies the .remark-slide-content class. Accepts CSS padding property values.

background_image

background_size

background_position

code_highlight_color

Code Line Highlight. Defaults to #268bd240. Modifies the .remark-code-line-highlighted class. The value of this variable is also stored as a CSS variable that can be referenced with var(--code-highlight-color) in any argument of a style function or in custom CSS.

code_inline_color

Inline Code Color. Defaults to #6c71c4. Modifies the .remark-inline-code class.

code_inline_background_color

Inline Code Background Color. Defaults to NULL. Modifies the .remark-inline-code class.

code_inline_font_size

inverse_background_color

Inverse Background Color. Defaults to #fdf6e3. Modifies the .inverse class. The value of this variable is also stored as a CSS variable that can be referenced with var(--inverse-background-color) in any argument of a style function or in custom CSS.

inverse_text_color

Inverse Text Color. Defaults to #002b36. Modifies the .inverse class. The value of this variable is also stored as a CSS variable that can be referenced with var(--inverse-text-color) in any argument of a style function or in custom CSS.

inverse_text_shadow

Enables Shadow on text of inverse slides. Defaults to FALSE. Modifies the .inverse class.

inverse_header_color

inverse_link_color

title_slide_text_color

title_slide_background_color

title_slide_background_image

Title Slide Background Image URL. Defaults to NULL. Modifies the .title-slide class.

title_slide_background_size

Title Slide Background Image Size, defaults to "cover" if background image is set. Defaults to NULL. Modifies the .title-slide class. Accepts CSS background-size property values.

title_slide_background_position

Title Slide Background Image Position. Defaults to NULL. Modifies the .title-slide class. Accepts CSS background-position property values.

footnote_color

Footnote text color (if NA, then it will be the same color as text_color). Defaults to NULL. Modifies the .footnote class.

footnote_font_size

Footnote font size. Defaults to 0.9em. Modifies the .footnote class. Accepts CSS font-size property values.

footnote_position_bottom

Footnote location from bottom of screen. Defaults to 60px. Modifies the .footnote class. Accepts CSS position property values.

left_column_subtle_color

Left Column Text (not last). Defaults to #586e75. Modifies the ⁠.left-column h2, .left-column h3⁠ classes.

left_column_selected_color

Left Column Current Selection. Defaults to #93a1a1. Modifies the ⁠.left-column h2:last-of-type, .left-column h3:last-child⁠ classes.

blockquote_left_border_color

Blockquote Left Border Color. Defaults to #cb4b16. Modifies the blockquote element.

table_border_color

Table top/bottom border. Defaults to #657b83. Modifies the ⁠table: border-top, border-bottom⁠ elements.

table_row_border_color

Table row inner bottom border. Defaults to #657b83. Modifies the ⁠table thead th: border-bottom⁠ elements.

table_row_even_background_color

Table Even Row Background Color. Defaults to #073642. Modifies the ⁠thead, tfoot, tr:nth-child(even)⁠ elements.

base_font_size

text_font_size

header_h1_font_size

header_h2_font_size

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. Defaults to FALSE.

header_background_color

header_background_text_color

header_background_padding

Padding for h1 Header with Background. Defaults to NULL. Modifies the ⁠.remark-slide-content h1⁠ class. Accepts CSS padding property values.

header_background_content_padding_top

Top Padding for Content in Slide with Header with Background. Defaults to 7rem. Modifies the .remark-slide-content class.

header_background_ignore_classes

Slide Classes Where Header with Background will not be Applied. Defaults to c('normal', 'inverse', 'title', 'middle', 'bottom'). Modifies the .remark-slide-content class.

text_slide_number_font_size

Slide Number Text Font Size. Defaults to 0.9rem. Modifies the .remark-slide-number class. Accepts CSS font-size property values.

text_font_google

Use google_font() to specify body font. Defaults to NULL. Modifies the body element.

text_font_family

text_font_weight

Body Text Font Weight. Defaults to xaringanthemer_font_default("text_font_weight"). Modifies the body element. Accepts CSS font-weight property values.

text_bold_font_weight

Body Bold Text Font Weight. Defaults to bold. Modifies the strong element.

text_font_url

Body Text Font URL(s). Defaults to xaringanthemer_font_default("text_font_url"). Modifies the ⁠@import url()⁠ elements.

text_font_family_fallback

text_font_base

header_font_google

Use google_font() to specify header font. Defaults to NULL. Modifies the body element.

header_font_family

header_font_weight

Header Font Weight. Defaults to xaringanthemer_font_default("header_font_weight"). Modifies the ⁠h1, h2, h3⁠ elements. Accepts CSS font-weight property values.

header_font_family_fallback

header_font_url

Header Font URL. Defaults to xaringanthemer_font_default("header_font_url"). Modifies the ⁠@import url⁠ elements.

code_font_google

Use google_font() to specify code font. Defaults to NULL. Modifies the body element.

code_font_family

code_font_size

code_font_url

Code Font URL. Defaults to xaringanthemer_font_default("code_font_url"). Modifies the ⁠@import url⁠ elements.

code_font_family_fallback

Code Font Fallback. Defaults to xaringanthemer_font_default("code_font_family_fallback"). Modifies the ⁠.remark-code, .remark-inline-code⁠ classes.

link_decoration

Text decoration of links. Defaults to none. Modifies the ⁠a, a > code⁠ elements. Accepts CSS text-decoration property values.

colors

extra_css

A named list of CSS definitions each containing a named list of CSS property-value pairs, i.e. list(".class-id" = list("css-property" = "value")).

extra_fonts

outfile

Customized xaringan CSS output file name, default is "xaringan-themer.css"

Value

The CSS styles are written to the file path provided in outfile (by default to xaringan-themer.css). If outfile is NULL, the CSS is returned directly as a character string.

Usage

output:
xaringan::moon_reader:
  css: xaringan-themer.css

References

https://ethanschoonover.com/solarized/

Examples

# Create a xaringan style in a temporary file
xaringan_themer_css <- tempfile("xaringan-themer-", fileext = ".css")

style_solarized_dark(
  outfile = xaringan_themer_css # omit in your slides to write the
                                # styles to xaringan-themer.css
)

# View the CSS:
# file.edit(xaringan_themer_css)

Solarized Light Theme

Description

A light theme based around on the solarized color scheme. Works well with "highlightStyle: solarized-dark" or "highlighStyle: solarized-light".

Usage

style_solarized_light(
  text_color = "#657b83",
  header_color = "#dc322f",
  background_color = "#fdf6e3",
  link_color = "#b58900",
  text_bold_color = "#d33682",
  text_slide_number_color = "#93a1a1",
  padding = "16px 64px 16px 64px",
  background_image = NULL,
  background_size = NULL,
  background_position = NULL,
  code_highlight_color = "#268bd240",
  code_inline_color = "#6c71c4",
  code_inline_background_color = NULL,
  code_inline_font_size = "1em",
  inverse_background_color = "#002b36",
  inverse_text_color = "#fdf6e3",
  inverse_text_shadow = FALSE,
  inverse_header_color = inverse_text_color,
  inverse_link_color = link_color,
  title_slide_text_color = inverse_text_color,
  title_slide_background_color = inverse_background_color,
  title_slide_background_image = NULL,
  title_slide_background_size = NULL,
  title_slide_background_position = NULL,
  footnote_color = NULL,
  footnote_font_size = "0.9em",
  footnote_position_bottom = "60px",
  left_column_subtle_color = "#93a1a1",
  left_column_selected_color = "#586e75",
  blockquote_left_border_color = "#cb4b16",
  table_border_color = "#839496",
  table_row_border_color = "#839496",
  table_row_even_background_color = "#eee8d5",
  base_font_size = "20px",
  text_font_size = "1rem",
  header_h1_font_size = "2.75rem",
  header_h2_font_size = "2.25rem",
  header_h3_font_size = "1.75rem",
  header_background_auto = FALSE,
  header_background_color = header_color,
  header_background_text_color = background_color,
  header_background_padding = NULL,
  header_background_content_padding_top = "7rem",
  header_background_ignore_classes = c("normal", "inverse", "title", "middle", "bottom"),
  text_slide_number_font_size = "0.9rem",
  text_font_google = NULL,
  text_font_family = xaringanthemer_font_default("text_font_family"),
  text_font_weight = xaringanthemer_font_default("text_font_weight"),
  text_bold_font_weight = "bold",
  text_font_url = xaringanthemer_font_default("text_font_url"),
  text_font_family_fallback = xaringanthemer_font_default("text_font_family_fallback"),
  text_font_base = "sans-serif",
  header_font_google = NULL,
  header_font_family = xaringanthemer_font_default("header_font_family"),
  header_font_weight = xaringanthemer_font_default("header_font_weight"),
  header_font_family_fallback = "Georgia, serif",
  header_font_url = xaringanthemer_font_default("header_font_url"),
  code_font_google = NULL,
  code_font_family = xaringanthemer_font_default("code_font_family"),
  code_font_size = "0.9rem",
  code_font_url = xaringanthemer_font_default("code_font_url"),
  code_font_family_fallback = xaringanthemer_font_default("code_font_family_fallback"),
  link_decoration = "none",
  colors = NULL,
  extra_css = NULL,
  extra_fonts = NULL,
  outfile = "xaringan-themer.css"
)

Arguments

text_color

Text Color. Defaults to #657b83. Modifies the body element. The value of this variable is also stored as a CSS variable that can be referenced with var(--text_color) in any argument of a style function or in custom CSS.

header_color

background_color

Slide Background Color. Defaults to #fdf6e3. Modifies the .remark-slide-content class. The value of this variable is also stored as a CSS variable that can be referenced with var(--background-color) in any argument of a style function or in custom CSS.

link_color

text_bold_color

text_slide_number_color

Slide Number Color. Defaults to #93a1a1. Modifies the .remark-slide-number class.

padding

Slide Padding in ⁠top right [bottom left]⁠ format. Defaults to 16px 64px 16px 64px. Modifies the .remark-slide-content class. Accepts CSS padding property values.

background_image

background_size

background_position

code_highlight_color

code_inline_color

Inline Code Color. Defaults to #6c71c4. Modifies the .remark-inline-code class.

code_inline_background_color

Inline Code Background Color. Defaults to NULL. Modifies the .remark-inline-code class.

code_inline_font_size

inverse_background_color

Inverse Background Color. Defaults to #002b36. Modifies the .inverse class. The value of this variable is also stored as a CSS variable that can be referenced with var(--inverse-background-color) in any argument of a style function or in custom CSS.

inverse_text_color

Inverse Text Color. Defaults to #fdf6e3. Modifies the .inverse class. The value of this variable is also stored as a CSS variable that can be referenced with var(--inverse-text-color) in any argument of a style function or in custom CSS.

inverse_text_shadow

Enables Shadow on text of inverse slides. Defaults to FALSE. Modifies the .inverse class.

inverse_header_color

inverse_link_color

title_slide_text_color

title_slide_background_color

title_slide_background_image

Title Slide Background Image URL. Defaults to NULL. Modifies the .title-slide class.

title_slide_background_size

Title Slide Background Image Size, defaults to "cover" if background image is set. Defaults to NULL. Modifies the .title-slide class. Accepts CSS background-size property values.

title_slide_background_position

Title Slide Background Image Position. Defaults to NULL. Modifies the .title-slide class. Accepts CSS background-position property values.

footnote_color

Footnote text color (if NA, then it will be the same color as text_color). Defaults to NULL. Modifies the .footnote class.

footnote_font_size

Footnote font size. Defaults to 0.9em. Modifies the .footnote class. Accepts CSS font-size property values.

footnote_position_bottom

Footnote location from bottom of screen. Defaults to 60px. Modifies the .footnote class. Accepts CSS position property values.

left_column_subtle_color

Left Column Text (not last). Defaults to #93a1a1. Modifies the ⁠.left-column h2, .left-column h3⁠ classes.

left_column_selected_color

Left Column Current Selection. Defaults to #586e75. Modifies the ⁠.left-column h2:last-of-type, .left-column h3:last-child⁠ classes.

blockquote_left_border_color

Blockquote Left Border Color. Defaults to #cb4b16. Modifies the blockquote element.

table_border_color

Table top/bottom border. Defaults to #839496. Modifies the ⁠table: border-top, border-bottom⁠ elements.

table_row_border_color

Table row inner bottom border. Defaults to #839496. Modifies the ⁠table thead th: border-bottom⁠ elements.

table_row_even_background_color

Table Even Row Background Color. Defaults to #eee8d5. Modifies the ⁠thead, tfoot, tr:nth-child(even)⁠ elements.

base_font_size

text_font_size

header_h1_font_size

header_h2_font_size

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. Defaults to FALSE.

header_background_color

header_background_text_color

header_background_padding

Padding for h1 Header with Background. Defaults to NULL. Modifies the ⁠.remark-slide-content h1⁠ class. Accepts CSS padding property values.

header_background_content_padding_top

Top Padding for Content in Slide with Header with Background. Defaults to 7rem. Modifies the .remark-slide-content class.

header_background_ignore_classes

Slide Classes Where Header with Background will not be Applied. Defaults to c('normal', 'inverse', 'title', 'middle', 'bottom'). Modifies the .remark-slide-content class.

text_slide_number_font_size

Slide Number Text Font Size. Defaults to 0.9rem. Modifies the .remark-slide-number class. Accepts CSS font-size property values.

text_font_google

Use google_font() to specify body font. Defaults to NULL. Modifies the body element.

text_font_family

text_font_weight

Body Text Font Weight. Defaults to xaringanthemer_font_default("text_font_weight"). Modifies the body element. Accepts CSS font-weight property values.

text_bold_font_weight

Body Bold Text Font Weight. Defaults to bold. Modifies the strong element.

text_font_url

Body Text Font URL(s). Defaults to xaringanthemer_font_default("text_font_url"). Modifies the ⁠@import url()⁠ elements.

text_font_family_fallback

text_font_base

header_font_google

Use google_font() to specify header font. Defaults to NULL. Modifies the body element.

header_font_family

header_font_weight

Header Font Weight. Defaults to xaringanthemer_font_default("header_font_weight"). Modifies the ⁠h1, h2, h3⁠ elements. Accepts CSS font-weight property values.

header_font_family_fallback

header_font_url

Header Font URL. Defaults to xaringanthemer_font_default("header_font_url"). Modifies the ⁠@import url⁠ elements.

code_font_google

Use google_font() to specify code font. Defaults to NULL. Modifies the body element.

code_font_family

code_font_size

code_font_url

Code Font URL. Defaults to xaringanthemer_font_default("code_font_url"). Modifies the ⁠@import url⁠ elements.

code_font_family_fallback

Code Font Fallback. Defaults to xaringanthemer_font_default("code_font_family_fallback"). Modifies the ⁠.remark-code, .remark-inline-code⁠ classes.

link_decoration

Text decoration of links. Defaults to none. Modifies the ⁠a, a > code⁠ elements. Accepts CSS text-decoration property values.

colors

extra_css

A named list of CSS definitions each containing a named list of CSS property-value pairs, i.e. list(".class-id" = list("css-property" = "value")).

extra_fonts

outfile

Customized xaringan CSS output file name, default is "xaringan-themer.css"

Value

The CSS styles are written to the file path provided in outfile (by default to xaringan-themer.css). If outfile is NULL, the CSS is returned directly as a character string.

Usage

output:
xaringan::moon_reader:
  css: xaringan-themer.css

References

https://ethanschoonover.com/solarized/

Examples

# Create a xaringan style in a temporary file
xaringan_themer_css <- tempfile("xaringan-themer-", fileext = ".css")

style_solarized_light(
  outfile = xaringan_themer_css # omit in your slides to write the
                                # styles to xaringan-themer.css
)

# View the CSS:
# file.edit(xaringan_themer_css)

A Plot Theme for ggplot2 by xaringanthemer

Description

Creates ggplot2 themes to match the xaringanthemer theme used in the xaringan slides that seamlessly matches the "normal" slide colors and styles. See vignette("ggplot2-themes") for more information and examples.

Usage

theme_xaringan(
  text_color = NULL,
  background_color = NULL,
  accent_color = NULL,
  accent_secondary_color = NULL,
  css_file = NULL,
  set_ggplot_defaults = TRUE,
  text_font = NULL,
  text_font_use_google = NULL,
  text_font_size = NULL,
  title_font = NULL,
  title_font_use_google = NULL,
  title_font_size = NULL,
  use_showtext = NULL
)

Arguments

text_color

Color for text and foreground, inherits from text_color

background_color

Color for background, inherits from background_color

accent_color

Color for titles and accents, inherits from header_color

accent_secondary_color

Color for secondary accents, inherits from text_bold_color

css_file

Path to a xaringanthemer CSS file, from which the theme variables and values will be inferred. In general, if you use the xaringathemer defaults, you will not need to set this. This feature lets you create a ggplot2 theme for your xaringan slides, even if you have only saved your theme CSS file and you aren't creating your CSS theme with xaringanthemer in your slides' source file.

set_ggplot_defaults

Should defaults be set for ggplot2 geoms? Defaults to TRUE. To restore ggplot's defaults, or the previously set geom defaults, see theme_xaringan_restore_defaults().

text_font

Font to use for text elements, passed to sysfonts::font_add_google(), if available and text_font_use_google is TRUE. Inherits from text_font_family. If manually specified, can be a google_font().

text_font_use_google

Is text_font available on Google Fonts?

text_font_size

Base text font size, inherits from text_font_size, or defaults to 11.

title_font

Font to use for title elements, passed to sysfonts::font_add_google(), if available and title_font_use_google is TRUE. Inherits from title_font_family. If manually specified, can be a google_font().

title_font_use_google

Is title_font available on Google Fonts?

title_font_size

Base text font size, inherits from title_font_size, or defaults to 14.

use_showtext

If TRUE the showtext package will be used to register Google fonts. Set to FALSE to disable this feature entirely, which may result in errors during plotting if the fonts used are not available locally. The default is TRUE when the showtext package is installed.

Value

A ggplot2 theme

Examples

# Requires ggplot2
has_ggplot2 <- requireNamespace("ggplot2", quietly = TRUE)

if (has_ggplot2) {
  # Because this is an example, we'll save the CSS to a temp file
  path_to_css_file <- tempfile(fileext = ".css")

  # Create the xaringan theme: dark blue background with teal green accents
  style_duo(
    primary_color = "#002b36",
    secondary_color = "#31b09e",
    # Using basic fonts for this example, but the plot theme will
    # automatically use your theme font if you use Google fonts
    text_font_family = "sans",
    header_font_family = "serif",
    outfile = path_to_css_file
  )

  library(ggplot2)
  ggplot(mpg) +
    aes(cty, hwy) +
    geom_point() +
    ggtitle("Fuel Efficiency of Various Cars") +
    theme_xaringan()
}

The ggplot2 xaringanthemer base plot theme

Description

Provides a base plot theme for ggplot2 to match the xaringan slide theme created by xaringanthemer. The theme is designed to create a general plot style from two colors, a background_color and a text_color (or foreground color). Also accepts an accent_color and an accent_secondary_color that are xaringanthemer is not required for the base theme. Use theme_xaringan() or theme_xaringan_inverse() in xaringan slides styled by xaringanthemer for a plot theme that matches the slide style. See vignette("ggplot2-themes") for more information and examples.

Usage

theme_xaringan_base(
  text_color,
  background_color,
  ...,
  set_ggplot_defaults = TRUE,
  accent_color = NULL,
  accent_secondary_color = NULL,
  text_font = NULL,
  text_font_use_google = NULL,
  text_font_size = NULL,
  title_font = NULL,
  title_font_use_google = NULL,
  title_font_size = NULL,
  use_showtext = NULL
)

Arguments

text_color

Color for text and foreground

background_color

Color for background

...

Ignored

set_ggplot_defaults

Should defaults be set for ggplot2 geoms? Defaults to TRUE. To restore ggplot's defaults, or the previously set geom defaults, see theme_xaringan_restore_defaults().

accent_color

Color for titles and accents, inherits from header_color or text_color. Used for the title base setting in ggplot2::theme(), and additionally for setting the color or fill of ggplot2 geom defaults.

accent_secondary_color

Color for secondary accents, inherits from text_bold_color or accent_color. Used only when setting ggplot2 geom defaults.

text_font

text_font_use_google

Is text_font available on Google Fonts?

text_font_size

Base text font size, inherits from text_font_size, or defaults to 11.

title_font

title_font_use_google

Is title_font available on Google Fonts?

title_font_size

Base text font size, inherits from title_font_size, or defaults to 14.

use_showtext

Value

A ggplot2 theme

Examples

# Requires ggplot2
has_ggplot2 <- requireNamespace("ggplot2", quietly = TRUE)

if (has_ggplot2) {
  library(ggplot2)

  plot1 <- ggplot(mpg) +
    aes(cty, hwy) +
    geom_point() +
    theme_xaringan_base(
      text_color = "#602f6b",       # imperial
      background_color = "#f8f8f8", # light gray
      accent_color = "#317873",     # myrtle green
      title_font = "sans",
      text_font = "serif",
      set_ggplot_defaults = TRUE
    ) +
    labs(
      title = "Fuel Efficiency of Various Cars",
      subtitle = "+ theme_xaringan_base()",
      caption = "xaringanthemer"
    )

  print(plot1)

  plot2 <- ggplot(mpg) +
    aes(hwy) +
    geom_histogram(binwidth = 2) +
    theme_xaringan_base(
      text_color = "#a8a9c8",       # light purple
      background_color = "#303163", # deep slate purple
      accent_color = "#ffff99",     # canary yellow
      title_font = "sans",
      text_font = "serif",
      set_ggplot_defaults = TRUE
    ) +
    labs(
      title = "Highway Fuel Efficiency",
      subtitle = "+ theme_xaringan_base()",
      caption = "xaringanthemer"
    )

  print(plot2)
}

Get the Value of xaringanthemer Style Setting

Description

A helper function to retrieve the value of style settings as set by a xaringanthemer style function, for use in plotting and other circumstances.

Usage

theme_xaringan_get_value(setting, css_file = NULL)

Arguments

setting

A xaringanthemer style setting

css_file

Value

The value of the xaringanthemer style parameter.

Style Settings

Style settings used by xaringanthemer include:

background_color
background_image
background_position
background_size
blockquote_left_border_color
code_font_family
code_font_family_fallback
code_font_google
code_font_is_google
code_font_size
code_font_url
code_highlight_color
code_inline_background_color
code_inline_color
code_inline_font_size
extra_css
extra_fonts
footnote_color
footnote_font_size
footnote_position_bottom
header_background_auto
header_background_color
header_background_content_padding_top
header_background_ignore_classes
header_background_padding
header_background_text_color
header_color
header_font_family
header_font_google
header_font_is_google
header_font_url
header_font_weight
header_h1_font_size
header_h2_font_size
header_h3_font_size
inverse_background_color
inverse_header_color
inverse_text_color
inverse_text_shadow
left_column_selected_color
left_column_subtle_color
link_color
padding
table_border_color
table_row_border_color
table_row_even_background_color
text_bold_color
text_color
text_font_base
text_font_family
text_font_family_fallback
text_font_google
text_font_is_google
text_font_size
text_font_url
text_font_weight
text_slide_number_color
text_slide_number_font_size
title_slide_background_color
title_slide_background_image
title_slide_background_position
title_slide_background_size
title_slide_text_color

Examples

# Create a xaringanthemer style in a temporary file for this example
xaringan_themer_css <- tempfile("xaringan-themer", fileext = ".css")

style_solarized_light(outfile = xaringan_themer_css)

theme_xaringan_get_value("text_color")
theme_xaringan_get_value("background_color")
theme_xaringan_get_value("header_color")
theme_xaringan_get_value("text_bold_color")

An Inverse Plot Theme for ggplot2 by xaringanthemer

Description

A ggplot2 xaringanthemer plot theme to seamlessly match the "inverse" xaringan slide colors and styles as styled by xaringanthemer. See vignette("ggplot2-themes") for more information and examples.

Usage

theme_xaringan_inverse(
  text_color = NULL,
  background_color = NULL,
  accent_color = NULL,
  accent_secondary_color = NULL,
  css_file = NULL,
  set_ggplot_defaults = TRUE,
  text_font = NULL,
  text_font_use_google = NULL,
  text_font_size = NULL,
  title_font = NULL,
  title_font_use_google = NULL,
  title_font_size = NULL,
  use_showtext = NULL
)

Arguments

text_color

Color for text and foreground, inherits from text_color

background_color

Color for background, inherits from background_color

accent_color

Color for titles and accents, inherits from header_color

accent_secondary_color

Color for secondary accents, inherits from text_bold_color

css_file

set_ggplot_defaults

Should defaults be set for ggplot2 geoms? Defaults to TRUE. To restore ggplot's defaults, or the previously set geom defaults, see theme_xaringan_restore_defaults().

text_font

text_font_use_google

Is text_font available on Google Fonts?

text_font_size

Base text font size, inherits from text_font_size, or defaults to 11.

title_font

title_font_use_google

Is title_font available on Google Fonts?

title_font_size

Base text font size, inherits from title_font_size, or defaults to 14.

use_showtext

Value

A ggplot2 theme

Examples

# Requires ggplot2
has_ggplot2 <- requireNamespace("ggplot2", quietly = TRUE)

if (has_ggplot2) {
  # Because this is an example, we'll save the CSS to a temp file
  path_to_css_file <- tempfile(fileext = ".css")

  # Create the xaringan theme: dark blue background with teal green accents
  style_duo(
    primary_color = "#002b36",
    secondary_color = "#31b09e",
    # Using basic fonts for this example, but the plot theme will
    # automatically use your theme font if you use Google fonts
    text_font_family = "sans",
    header_font_family = "serif",
    outfile = path_to_css_file
  )

  library(ggplot2)
  ggplot(mpg) +
    aes(cty, hwy) +
    geom_point() +
    ggtitle("Fuel Efficiency of Various Cars") +
    # themed to match the inverse slides: teal background with dark blue text
    theme_xaringan_inverse()
}

Set and Restore ggplot2 geom Defaults

Description

Set ggplot2 geom defaults to match theme_xaringan() with theme_xaringan_set_defaults() and restore the standard or previously-set defaults with theme_xaringan_restore_defaults(). By default, theme_xaringan_set_defaults() is run with theme_xaringan() or theme_xaringan_inverse().

Usage

theme_xaringan_set_defaults(
  text_color = NULL,
  background_color = NULL,
  accent_color = text_color,
  accent_secondary_color = accent_color,
  text_font = NULL
)

theme_xaringan_restore_defaults()

Arguments

text_color

Color for text and foreground, inherits from text_color

background_color

Color for background, inherits from background_color

accent_color

Color for titles and accents, inherits from header_color

accent_secondary_color

Color for secondary accents, inherits from text_bold_color

text_font

Font to use for text elements, passed to sysfonts::font_add_google(), if available and text_font_use_google is TRUE. Inherits from text_font_family. Must be a length-one character.

Value

Invisibly returns a list of the current ggplot2 geom defaults

Functions

theme_xaringan_restore_defaults(): Restore previous or standard ggplot2 geom defaults.

Deprecated or renamed functions

Description

These functions in xaringanthemer have been deprecated or renamed.

Use style_xaringan() instead of write_xaringan_theme().

Use style_extra_css() instead of write_extra_css().

Use style_mono_light() instead of mono_light().

Use style_mono_dark() instead of mono_dark().

Use style_mono_accent() instead of mono_accent().

Use style_mono_accent_inverse() instead of mono_accent_inverse().

Use style_duo() instead of duo().

Use style_duo_accent() instead of duo_accent().

Use style_duo_accent_inverse() instead of duo_accent_inverse().

Use style_solarized_light() instead of solarized_light().

Use style_solarized_dark() instead of solarized_dark().

Usage

write_xaringan_theme(...)

write_extra_css(...)

mono_light(...)

mono_dark(...)

mono_accent(...)

mono_accent_inverse(...)

duo(...)

duo_accent(...)

duo_accent_inverse(...)

solarized_light(...)

solarized_dark(...)

Arguments

...

Argumets passed to the new or renamed functions.

Value

The result of the new or renamed function.

Write A Customized Xaringan Theme

Description

Creates a customized Xaringan theme CSS file.

Usage

xaringanthemer_font_default(font_arg)

style_xaringan(
  text_color = "#000",
  header_color = "#000",
  background_color = "#FFF",
  link_color = "rgb(249, 38, 114)",
  text_bold_color = NULL,
  text_slide_number_color = inverse_background_color,
  padding = "16px 64px 16px 64px",
  background_image = NULL,
  background_size = NULL,
  background_position = NULL,
  code_highlight_color = "rgba(255,255,0,0.5)",
  code_inline_color = "#000",
  code_inline_background_color = NULL,
  code_inline_font_size = "1em",
  inverse_background_color = "#272822",
  inverse_text_color = "#d6d6d6",
  inverse_text_shadow = FALSE,
  inverse_header_color = "#f3f3f3",
  inverse_link_color = link_color,
  title_slide_text_color = inverse_text_color,
  title_slide_background_color = inverse_background_color,
  title_slide_background_image = NULL,
  title_slide_background_size = NULL,
  title_slide_background_position = NULL,
  footnote_color = NULL,
  footnote_font_size = "0.9em",
  footnote_position_bottom = "60px",
  left_column_subtle_color = "#777",
  left_column_selected_color = "#000",
  blockquote_left_border_color = "lightgray",
  table_border_color = "#666",
  table_row_border_color = "#ddd",
  table_row_even_background_color = "#eee",
  base_font_size = "20px",
  text_font_size = "1rem",
  header_h1_font_size = "2.75rem",
  header_h2_font_size = "2.25rem",
  header_h3_font_size = "1.75rem",
  header_background_auto = FALSE,
  header_background_color = header_color,
  header_background_text_color = background_color,
  header_background_padding = NULL,
  header_background_content_padding_top = "7rem",
  header_background_ignore_classes = c("normal", "inverse", "title", "middle", "bottom"),
  text_slide_number_font_size = "0.9rem",
  text_font_google = NULL,
  text_font_family = xaringanthemer_font_default("text_font_family"),
  text_font_weight = xaringanthemer_font_default("text_font_weight"),
  text_bold_font_weight = "bold",
  text_font_url = xaringanthemer_font_default("text_font_url"),
  text_font_family_fallback = xaringanthemer_font_default("text_font_family_fallback"),
  text_font_base = "sans-serif",
  header_font_google = NULL,
  header_font_family = xaringanthemer_font_default("header_font_family"),
  header_font_weight = xaringanthemer_font_default("header_font_weight"),
  header_font_family_fallback = "Georgia, serif",
  header_font_url = xaringanthemer_font_default("header_font_url"),
  code_font_google = NULL,
  code_font_family = xaringanthemer_font_default("code_font_family"),
  code_font_size = "0.9rem",
  code_font_url = xaringanthemer_font_default("code_font_url"),
  code_font_family_fallback = xaringanthemer_font_default("code_font_family_fallback"),
  link_decoration = "none",
  colors = NULL,
  extra_css = NULL,
  extra_fonts = NULL,
  outfile = "xaringan-themer.css"
)

Arguments

font_arg

A font argument from the xaringanthemer style_ function family.

text_color

Text Color. Defaults to #000. Modifies the body element. The value of this variable is also stored as a CSS variable that can be referenced with var(--text_color) in any argument of a style function or in custom CSS.

header_color

Header Color. Defaults to #000. Modifies the ⁠h1, h2, h3⁠ elements. The value of this variable is also stored as a CSS variable that can be referenced with var(--header-color) in any argument of a style function or in custom CSS.

background_color

Slide Background Color. Defaults to #FFF. Modifies the .remark-slide-content class. The value of this variable is also stored as a CSS variable that can be referenced with var(--background-color) in any argument of a style function or in custom CSS.

link_color

Link Color. Defaults to rgb(249, 38, 114). Modifies the ⁠a, a > code⁠ elements. The value of this variable is also stored as a CSS variable that can be referenced with var(--link-color) in any argument of a style function or in custom CSS.

text_bold_color

Bold Text Color. Defaults to NULL. Modifies the strong element. The value of this variable is also stored as a CSS variable that can be referenced with var(--text-bold-color) in any argument of a style function or in custom CSS.

text_slide_number_color

Slide Number Color. Defaults to inverse_background_color. Modifies the .remark-slide-number class.

padding

Slide Padding in ⁠top right [bottom left]⁠ format. Defaults to 16px 64px 16px 64px. Modifies the .remark-slide-content class. Accepts CSS padding property values.

background_image

background_size

background_position

code_highlight_color

code_inline_color

Inline Code Color. Defaults to #000. Modifies the .remark-inline-code class.

code_inline_background_color

Inline Code Background Color. Defaults to NULL. Modifies the .remark-inline-code class.

code_inline_font_size

inverse_background_color

Inverse Background Color. Defaults to #272822. Modifies the .inverse class. The value of this variable is also stored as a CSS variable that can be referenced with var(--inverse-background-color) in any argument of a style function or in custom CSS.

inverse_text_color

Inverse Text Color. Defaults to #d6d6d6. Modifies the .inverse class. The value of this variable is also stored as a CSS variable that can be referenced with var(--inverse-text-color) in any argument of a style function or in custom CSS.

inverse_text_shadow

Enables Shadow on text of inverse slides. Defaults to FALSE. Modifies the .inverse class.

inverse_header_color

Inverse Header Color. Defaults to #f3f3f3. Modifies the ⁠.inverse h1, .inverse h2, .inverse h3⁠ classes. The value of this variable is also stored as a CSS variable that can be referenced with var(--inverse-header-color) in any argument of a style function or in custom CSS.

inverse_link_color

title_slide_text_color

title_slide_background_color

title_slide_background_image

Title Slide Background Image URL. Defaults to NULL. Modifies the .title-slide class.

title_slide_background_size

Title Slide Background Image Size, defaults to "cover" if background image is set. Defaults to NULL. Modifies the .title-slide class. Accepts CSS background-size property values.

title_slide_background_position

Title Slide Background Image Position. Defaults to NULL. Modifies the .title-slide class. Accepts CSS background-position property values.

footnote_color

Footnote text color (if NA, then it will be the same color as text_color). Defaults to NULL. Modifies the .footnote class.

footnote_font_size

Footnote font size. Defaults to 0.9em. Modifies the .footnote class. Accepts CSS font-size property values.

footnote_position_bottom

Footnote location from bottom of screen. Defaults to 60px. Modifies the .footnote class. Accepts CSS position property values.

left_column_subtle_color

Left Column Text (not last). Defaults to #777. Modifies the ⁠.left-column h2, .left-column h3⁠ classes.

left_column_selected_color

Left Column Current Selection. Defaults to #000. Modifies the ⁠.left-column h2:last-of-type, .left-column h3:last-child⁠ classes.

blockquote_left_border_color

Blockquote Left Border Color. Defaults to lightgray. Modifies the blockquote element.

table_border_color

Table top/bottom border. Defaults to #666. Modifies the ⁠table: border-top, border-bottom⁠ elements.

table_row_border_color

Table row inner bottom border. Defaults to #ddd. Modifies the ⁠table thead th: border-bottom⁠ elements.

table_row_even_background_color

Table Even Row Background Color. Defaults to #eee. Modifies the ⁠thead, tfoot, tr:nth-child(even)⁠ elements.

base_font_size

text_font_size

header_h1_font_size

header_h2_font_size

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. Defaults to FALSE.

header_background_color

header_background_text_color

header_background_padding

Padding for h1 Header with Background. Defaults to NULL. Modifies the ⁠.remark-slide-content h1⁠ class. Accepts CSS padding property values.

header_background_content_padding_top

Top Padding for Content in Slide with Header with Background. Defaults to 7rem. Modifies the .remark-slide-content class.

header_background_ignore_classes

Slide Classes Where Header with Background will not be Applied. Defaults to c('normal', 'inverse', 'title', 'middle', 'bottom'). Modifies the .remark-slide-content class.

text_slide_number_font_size

Slide Number Text Font Size. Defaults to 0.9rem. Modifies the .remark-slide-number class. Accepts CSS font-size property values.

text_font_google

Use google_font() to specify body font. Defaults to NULL. Modifies the body element.

text_font_family

text_font_weight

Body Text Font Weight. Defaults to xaringanthemer_font_default("text_font_weight"). Modifies the body element. Accepts CSS font-weight property values.

text_bold_font_weight

Body Bold Text Font Weight. Defaults to bold. Modifies the strong element.

text_font_url

Body Text Font URL(s). Defaults to xaringanthemer_font_default("text_font_url"). Modifies the ⁠@import url()⁠ elements.

text_font_family_fallback

text_font_base

header_font_google

Use google_font() to specify header font. Defaults to NULL. Modifies the body element.

header_font_family

header_font_weight

Header Font Weight. Defaults to xaringanthemer_font_default("header_font_weight"). Modifies the ⁠h1, h2, h3⁠ elements. Accepts CSS font-weight property values.

header_font_family_fallback

header_font_url

Header Font URL. Defaults to xaringanthemer_font_default("header_font_url"). Modifies the ⁠@import url⁠ elements.

code_font_google

Use google_font() to specify code font. Defaults to NULL. Modifies the body element.

code_font_family

code_font_size

code_font_url

Code Font URL. Defaults to xaringanthemer_font_default("code_font_url"). Modifies the ⁠@import url⁠ elements.

code_font_family_fallback

Code Font Fallback. Defaults to xaringanthemer_font_default("code_font_family_fallback"). Modifies the ⁠.remark-code, .remark-inline-code⁠ classes.

link_decoration

Text decoration of links. Defaults to none. Modifies the ⁠a, a > code⁠ elements. Accepts CSS text-decoration property values.

colors

extra_css

A named list of CSS definitions each containing a named list of CSS property-value pairs, i.e. list(".class-id" = list("css-property" = "value")).

extra_fonts

outfile

Customized xaringan CSS output file name, default is "xaringan-themer.css"

Value

The CSS styles are written to the file path provided in outfile (by default to xaringan-themer.css). If outfile is NULL, the CSS is returned directly as a character string.

Functions

xaringanthemer_font_default(): Default values for font family, weight, URLs and font fallbacks.

Usage

output:
xaringan::moon_reader:
  css: xaringan-themer.css

Examples

# Create a xaringan style in a temporary file
xaringan_themer_css <- tempfile("xaringan-themer-", fileext = ".css")

style_xaringan(
  text_color = "#002b3",
  inverse_background_color = "#31b09e",
  inverse_text_color = "#002b3",
  outfile = xaringan_themer_css # omit in your slides to write the
                                # styles to xaringan-themer.css
)

# View the CSS:
# file.edit(xaringan_themer_css)

xaringanthemer: Custom 'xaringan' CSS Themes

Description

Author(s)

See Also

Add alpha to hex color

Description

Usage

Arguments

Value

Examples

Choose dark or light color

Description

Usage

Arguments

Value

References

Examples

Specify Google Font

Description

Usage

Arguments

Value

Examples

List Valid Google Language Codes

Description

Usage

Arguments

Value

See Also

Generate lighter or darker version of a color

Description

Usage

Arguments

Value

Examples

Themed ggplot2 Scales

Description

Usage

Arguments

Examples

Duotone Theme

Description

Usage

Arguments

Value

Usage

See Also

Examples

Duotone Accent Theme

Description

Usage

Arguments

Value

Usage

See Also

Examples

Duotone Accent Inverse Theme

Description

Usage

Arguments

Value

Usage

See Also

Examples

Add Extra CSS Styles

Description

Usage

Arguments

css list

Examples

Monotone Accent Theme

Description

Usage

Arguments

Value

Usage

See Also

Examples

Monotone Accent Inverse Theme

Description