😎 Give your xaringan slides some style
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

147 lines
3.8KB

  1. **xaringanthemer** includes a number of functions that provide
  2. themed **xaringan** styles.
  3. All of the styling functions start with the `style_` prefix.
  4. The goal of each style function is to
  5. quickly set up a coordinated color palette for your slides
  6. based on one or two starter colors.
  7. Styles based on one color start with `style_mono_`
  8. and styles based on two colors start with `style_duo_`.
  9. How the starter colors are used is described
  10. in the final portion of the style function name.
  11. For example, `style_mono_accent()` uses a single color as an accent color.
  12. Note that the colors used below are for demonstration only,
  13. the point of the `style_` functions is for you to choose your own color palette!
  14. ### Monotone
  15. ```{r include=FALSE}
  16. IS_README <- exists("IS_README") && IS_README
  17. include_graphic <- function(img_path) {
  18. glue::glue("![](https://raw.githubusercontent.com/gadenbuie/xaringanthemer/assets/{img_path})")
  19. }
  20. ```
  21. Use these functions to automatically create a consistent color palette for your slides, based around a single color.
  22. #### `style_mono_light()`
  23. A light theme based around a single color.
  24. ```{r style_mono_light}
  25. demo_function_call <- function(f, n_params = 1) {
  26. cat(sep = "",
  27. "```r\n",
  28. paste(substitute(f)), "(",
  29. if (n_params > 0) paste(collapse = ", ",
  30. sapply(1:n_params, function(i) {
  31. paste0(names(formals(f))[i], ' = "', formals(f)[[i]], '"')})),
  32. ")\n```"
  33. )
  34. }
  35. demo_function_call(style_mono_light, 1)
  36. ```
  37. `r include_graphic("example_mono_light.png")`
  38. #### `style_mono_dark()`
  39. A dark theme based around a single color.
  40. ```{r style_mono_dark}
  41. demo_function_call(style_mono_dark, 1)
  42. ```
  43. `r include_graphic("example_mono_dark.png")`
  44. #### `style_mono_accent()`
  45. The default xaringan theme with a single color used for color accents on select elements (headers, bold text, etc.).
  46. ```{r style_mono_accent}
  47. demo_function_call(style_mono_accent, 1)
  48. ```
  49. `r include_graphic("example_mono_accent.png")`
  50. #### `style_mono_accent_inverse()`
  51. An "inverted" default xaringan theme with a single color used for color accents on select elements (headers, bold text, etc.).
  52. ```{r style_mono_accent_inverse}
  53. demo_function_call(style_mono_accent_inverse, 1)
  54. ```
  55. `r include_graphic("example_mono_accent_inverse.png")`
  56. ### Duotone
  57. These themes build from two (ideally) complementary colors.
  58. #### `style_duo()`
  59. A two-colored theme based on a primary and secondary color.
  60. ```{r style_duo}
  61. demo_function_call(style_duo, 2)
  62. ```
  63. `r include_graphic("example_duo.png")`
  64. #### `style_duo_accent()`
  65. The default Xaringan theme with two accent colors.
  66. ```{r style_duo_accent}
  67. demo_function_call(style_duo_accent, 2)
  68. ```
  69. `r include_graphic("example_duo_accent.png")`
  70. #### `style_duo_accent_inverse()`
  71. An "inverted" default Xaringan theme with two accent colors.
  72. ```{r style_duo_accent_inverse}
  73. demo_function_call(style_duo_accent_inverse, 2)
  74. ```
  75. `r include_graphic("example_duo_accent_inverse.png")`
  76. ### Solarized
  77. There are also two themes based around the [solarized color palette](http://ethanschoonover.com/solarized), `style_solarized_light()` and `style_solarized_dark()`.
  78. For both themes, it is advisted to change the syntax highlighting theme to `solarized-light` or `solarized-dark` (looks great paired or constrasted).
  79. #### `style_solarized_light()`
  80. ```{r style_solarized_light}
  81. demo_function_call(style_solarized_light, 0)
  82. ```
  83. `r include_graphic("example_solarized_light.png")`
  84. #### `style_solarized_dark()`
  85. ```{r style_solarized_dark}
  86. demo_function_call(style_solarized_dark, 0)
  87. ```
  88. `r include_graphic("example_solarized_dark.png")`
  89. To do this, your YAML header should look more-or-less like this:
  90. ```yaml
  91. output:
  92. xaringan::moon_reader:
  93. lib_dir: libs
  94. css: ["xaringan-themer.css"]
  95. nature:
  96. highlightStyle: solarized-dark
  97. highlightLines: true
  98. countIncrementalSlides: false
  99. ```