|
- <!DOCTYPE html>
- <!-- Generated by pkgdown: do not edit by hand --><html lang="en">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
- <meta charset="utf-8">
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>Template Variables • xaringanthemer</title>
- <!-- jquery --><script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script><!-- Bootstrap --><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha256-916EbMg70RQy9LHiGkXzG8hSg9EdNy97GazNG/aiY1w=" crossorigin="anonymous">
- <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha256-U5ZEeKfGNOja007MMD3YBI0A3OSZOQbeG6z2f2Y0hu8=" crossorigin="anonymous"></script><!-- Font Awesome icons --><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.7.1/css/all.min.css" integrity="sha256-nAmazAk6vS34Xqo0BSrTb+abbtFlgsFK7NKSi6o7Y78=" crossorigin="anonymous">
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.7.1/css/v4-shims.min.css" integrity="sha256-6qHlizsOWFskGlwVOKuns+D1nB6ssZrHQrNj1wGplHc=" crossorigin="anonymous">
- <!-- clipboard.js --><script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.4/clipboard.min.js" integrity="sha256-FiZwavyI2V6+EXO1U+xzLG3IKldpiTFf3153ea9zikQ=" crossorigin="anonymous"></script><!-- headroom.js --><script src="https://cdnjs.cloudflare.com/ajax/libs/headroom/0.9.4/headroom.min.js" integrity="sha256-DJFC1kqIhelURkuza0AvYal5RxMtpzLjFhsnVIeuk+U=" crossorigin="anonymous"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/headroom/0.9.4/jQuery.headroom.min.js" integrity="sha256-ZX/yNShbjqsohH1k95liqY9Gd8uOiE1S4vZc+9KQ1K4=" crossorigin="anonymous"></script><!-- pkgdown --><link href="../pkgdown.css" rel="stylesheet">
- <script src="../pkgdown.js"></script><link href="../extra.css" rel="stylesheet">
- <meta property="og:title" content="Template Variables">
- <meta property="og:description" content="">
- <meta name="twitter:card" content="summary">
- <meta name="robots" content="noindex">
- <!-- mathjax --><script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js" integrity="sha256-nvJJv9wWKEm88qvoQl9ekL2J+k/RWIsaSScxxlsrv8k=" crossorigin="anonymous"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/config/TeX-AMS-MML_HTMLorMML.js" integrity="sha256-84DKXVJXs0/F8OTMzX4UR909+jtl4G7SPypPavF+GfA=" crossorigin="anonymous"></script><!--[if lt IE 9]>
- <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
- <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
- <![endif]-->
- </head>
- <body>
- <div class="container template-article">
- <header><div class="navbar navbar-default navbar-fixed-top" role="navigation">
- <div class="container">
- <div class="navbar-header">
- <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false">
- <span class="sr-only">Toggle navigation</span>
- <span class="icon-bar"></span>
- <span class="icon-bar"></span>
- <span class="icon-bar"></span>
- </button>
- <span class="navbar-brand">
- <a class="navbar-link" href="../index.html">xaringanthemer</a>
- <span class="version label label-danger" data-toggle="tooltip" data-placement="bottom" title="In-development version">0.2.0.9100</span>
- </span>
- </div>
-
- <div id="navbar" class="navbar-collapse collapse">
- <ul class="nav navbar-nav">
- <li>
- <a href="../articles/xaringanthemer.html">Get started</a>
- </li>
- <li>
- <a href="../reference/index.html">Reference</a>
- </li>
- <li>
- <a href="../articles/themes.html">Themes</a>
- </li>
- <li>
- <a href="../articles/fonts.html">Fonts</a>
- </li>
- <li>
- <a href="../articles/template-variables.html">Template Variables</a>
- </li>
- <li>
- <a href="../articles/css-help.html">CSS Help</a>
- </li>
- </ul>
- <ul class="nav navbar-nav navbar-right">
- <li>
- <a href="../news/index.html">
- <span class="fa fa fa fa-newspaper-o fa-lg"></span>
-
-
- </a>
- </li>
- <li>
- <a href="https://github.com/gadenbuie/xaringanthemer">
- <span class="fa fa-github fa-lg"></span>
-
- </a>
- </li>
- <li>
- <a href="https://twitter.com/grrrck">
- <span class="fa fa-twitter fa-lg"></span>
-
- </a>
- </li>
- <li>
- <a href="https://www.garrickadenbuie.com">
- <span class="fa fa-home fa-lg"></span>
-
- </a>
- </li>
- </ul>
- </div>
- <!--/.nav-collapse -->
- </div>
- <!--/.container -->
- </div>
- <!--/.navbar -->
-
-
-
- </header><div class="row">
- <div class="col-md-9 contents">
- <div class="page-header toc-ignore">
- <h1>Template Variables</h1>
-
-
- <small class="dont-index">Source: <a href="https://github.com/gadenbuie/xaringanthemer/blob/master/vignettes/template-variables.Rmd"><code>vignettes/template-variables.Rmd</code></a></small>
- <div class="hidden name"><code>template-variables.Rmd</code></div>
-
- </div>
-
-
-
- <p>The following table shows the template variables, their default values in the standard <code>xaringan</code> theme, the primary element to which the property is applied, and a brief description of the template variable.</p>
- <p>For example, <code>background_color</code> by default sets the <code>background-color</code> CSS property of the <code>.remark-slide-content</code> class to <code>#FFF</code>.</p>
- <p>Use this table to find the template variable you would like to modify. You can also use this table to find the CSS class or element associated with a particular template item.</p>
- <p>Note that themes, like <code><a href="../reference/xaringanthemer-deprecated.html">mono_accent()</a></code>, have additional parameters, but with any theme function you can override the theme by directly setting the arguments below when calling the theme function. For example, to use <code><a href="../reference/xaringanthemer-deprecated.html">mono_accent()</a></code> with a different slide background color, you can call <code><a href="../reference/xaringanthemer-deprecated.html">mono_accent(background_color = "#abc123")</a></code>.</p>
- <table class="table">
- <thead><tr class="header">
- <th align="left">variable</th>
- <th align="left">description</th>
- <th align="left">element</th>
- <th align="left">default</th>
- </tr></thead>
- <tbody>
- <tr class="odd">
- <td align="left"><code>text_color</code></td>
- <td align="left">Text Color</td>
- <td align="left">body</td>
- <td align="left">#000</td>
- </tr>
- <tr class="even">
- <td align="left"><code>header_color</code></td>
- <td align="left">Header Color</td>
- <td align="left">h1, h2, h3</td>
- <td align="left">#000</td>
- </tr>
- <tr class="odd">
- <td align="left"><code>background_color</code></td>
- <td align="left">Slide Background Color</td>
- <td align="left">.remark-slide-content</td>
- <td align="left">#FFF</td>
- </tr>
- <tr class="even">
- <td align="left"><code>link_color</code></td>
- <td align="left">Link Color</td>
- <td align="left">a, a > code</td>
- <td align="left">rgb(249, 38, 114)</td>
- </tr>
- <tr class="odd">
- <td align="left"><code>text_bold_color</code></td>
- <td align="left">Bold Text Color</td>
- <td align="left">strong</td>
- <td align="left">NULL</td>
- </tr>
- <tr class="even">
- <td align="left"><code>text_slide_number_color</code></td>
- <td align="left">Slide Number Color</td>
- <td align="left">.remark-slide-number</td>
- <td align="left">inverse_background_color</td>
- </tr>
- <tr class="odd">
- <td align="left"><code>padding</code></td>
- <td align="left">Slide Padding in <code>top right [bottom left]</code> format</td>
- <td align="left">.remark-slide-content</td>
- <td align="left">16px 64px 16px 64px</td>
- </tr>
- <tr class="even">
- <td align="left"><code>background_image</code></td>
- <td align="left">Background image applied to each <em>and every</em> slide. Set <code>title_slide_background_image = "none"</code> to remove the background image from the title slide</td>
- <td align="left">.remark-slide-content</td>
- <td align="left">NULL</td>
- </tr>
- <tr class="odd">
- <td align="left"><code>background_size</code></td>
- <td align="left">Background image size, requires <code>background_image</code> to be set. If <code>background_image</code> is set, <code>background_size</code> will default to <code>cover</code> so the backround fills the screen. If both <code>background_image</code> and <code>background_position</code> are set, will default to 100 percent</td>
- <td align="left">.remark-slide-content</td>
- <td align="left">NULL</td>
- </tr>
- <tr class="even">
- <td align="left"><code>background_position</code></td>
- <td align="left">Background image position, requires <code>background_image</code> to be set, and it is recommended to adjust <code>background_size</code>
- </td>
- <td align="left">.remark-slide-content</td>
- <td align="left">NULL</td>
- </tr>
- <tr class="odd">
- <td align="left"><code>code_highlight_color</code></td>
- <td align="left">Code Line Highlight</td>
- <td align="left">.remark-code-line-highlighted</td>
- <td align="left">rgba(255,255,0,0.5)</td>
- </tr>
- <tr class="even">
- <td align="left"><code>code_inline_color</code></td>
- <td align="left">Inline Code Color</td>
- <td align="left">.remark-inline-code</td>
- <td align="left">#000</td>
- </tr>
- <tr class="odd">
- <td align="left"><code>code_inline_background_color</code></td>
- <td align="left">Inline Code Background Color</td>
- <td align="left">.remark-inline-code</td>
- <td align="left">NULL</td>
- </tr>
- <tr class="even">
- <td align="left"><code>code_inline_font_size</code></td>
- <td align="left">Inline Code Text Font Size</td>
- <td align="left">.remark-inline-code</td>
- <td align="left">1rem</td>
- </tr>
- <tr class="odd">
- <td align="left"><code>inverse_background_color</code></td>
- <td align="left">Inverse Background Color</td>
- <td align="left">.inverse</td>
- <td align="left">#272822</td>
- </tr>
- <tr class="even">
- <td align="left"><code>inverse_text_color</code></td>
- <td align="left">Inverse Text Color</td>
- <td align="left">.inverse</td>
- <td align="left">#d6d6d6</td>
- </tr>
- <tr class="odd">
- <td align="left"><code>inverse_text_shadow</code></td>
- <td align="left">Enables Shadow on text of inverse slides</td>
- <td align="left">.inverse</td>
- <td align="left">FALSE</td>
- </tr>
- <tr class="even">
- <td align="left"><code>inverse_header_color</code></td>
- <td align="left">Inverse Header Color</td>
- <td align="left">.inverse h1, .inverse h2, .inverse h3</td>
- <td align="left">#f3f3f3</td>
- </tr>
- <tr class="odd">
- <td align="left"><code>title_slide_text_color</code></td>
- <td align="left">Title Slide Text Color</td>
- <td align="left">.title-slide</td>
- <td align="left">inverse_text_color</td>
- </tr>
- <tr class="even">
- <td align="left"><code>title_slide_background_color</code></td>
- <td align="left">Title Slide Background Color</td>
- <td align="left">.title-slide</td>
- <td align="left">inverse_background_color</td>
- </tr>
- <tr class="odd">
- <td align="left"><code>title_slide_background_image</code></td>
- <td align="left">Title Slide Background Image URL</td>
- <td align="left">.title-slide</td>
- <td align="left">NULL</td>
- </tr>
- <tr class="even">
- <td align="left"><code>title_slide_background_size</code></td>
- <td align="left">Title Slide Background Image Size, defaults to “cover” if background image is set</td>
- <td align="left">.title-slide</td>
- <td align="left">NULL</td>
- </tr>
- <tr class="odd">
- <td align="left"><code>title_slide_background_position</code></td>
- <td align="left">Title Slide Background Image Position</td>
- <td align="left">.title-slide</td>
- <td align="left">NULL</td>
- </tr>
- <tr class="even">
- <td align="left"><code>footnote_color</code></td>
- <td align="left">Footnote text color (if <code>NA</code>, then it will be the same color as <code>text_color</code>)</td>
- <td align="left">.footnote</td>
- <td align="left">NULL</td>
- </tr>
- <tr class="odd">
- <td align="left"><code>footnote_font_size</code></td>
- <td align="left">Footnote font size</td>
- <td align="left">.footnote</td>
- <td align="left">0.9rem</td>
- </tr>
- <tr class="even">
- <td align="left"><code>footnote_position_bottom</code></td>
- <td align="left">Footnote location from bottom of screen</td>
- <td align="left">.footnote</td>
- <td align="left">60px</td>
- </tr>
- <tr class="odd">
- <td align="left"><code>left_column_subtle_color</code></td>
- <td align="left">Left Column Text (not last)</td>
- <td align="left">.left-column h2, .left-column h3</td>
- <td align="left">#777</td>
- </tr>
- <tr class="even">
- <td align="left"><code>left_column_selected_color</code></td>
- <td align="left">Left Column Current Selection</td>
- <td align="left">.left-column h2:last-of-type, .left-column h3:last-child</td>
- <td align="left">#000</td>
- </tr>
- <tr class="odd">
- <td align="left"><code>blockquote_left_border_color</code></td>
- <td align="left">Blockquote Left Border Color</td>
- <td align="left">blockquote</td>
- <td align="left">lightgray</td>
- </tr>
- <tr class="even">
- <td align="left"><code>table_border_color</code></td>
- <td align="left">Table top/bottom border</td>
- <td align="left">table: border-top, border-bottom</td>
- <td align="left">#666</td>
- </tr>
- <tr class="odd">
- <td align="left"><code>table_row_border_color</code></td>
- <td align="left">Table row inner bottom border</td>
- <td align="left">table thead th: border-bottom</td>
- <td align="left">#ddd</td>
- </tr>
- <tr class="even">
- <td align="left"><code>table_row_even_background_color</code></td>
- <td align="left">Table Even Row Background Color</td>
- <td align="left">thead, tfoot, tr:nth-child(even)</td>
- <td align="left">#eee</td>
- </tr>
- <tr class="odd">
- <td align="left"><code>base_font_size</code></td>
- <td align="left">Base Font Size for All Slide Elements (must be <code>px</code>)</td>
- <td align="left">html</td>
- <td align="left">20px</td>
- </tr>
- <tr class="even">
- <td align="left"><code>text_font_size</code></td>
- <td align="left">Slide Body Text Font Size</td>
- <td align="left">.remark-slide-content</td>
- <td align="left">1rem</td>
- </tr>
- <tr class="odd">
- <td align="left"><code>header_h1_font_size</code></td>
- <td align="left">h1 Header Text Font Size</td>
- <td align="left">.remark-slide-content h1</td>
- <td align="left">2.75rem</td>
- </tr>
- <tr class="even">
- <td align="left"><code>header_h2_font_size</code></td>
- <td align="left">h2 Header Text Font Size</td>
- <td align="left">.remark-slide-content h2</td>
- <td align="left">2.25rem</td>
- </tr>
- <tr class="odd">
- <td align="left"><code>header_h3_font_size</code></td>
- <td align="left">h3 Header Text Font Size</td>
- <td align="left">.remark-slide-content h3</td>
- <td align="left">1.75rem</td>
- </tr>
- <tr class="even">
- <td align="left"><code>header_background_auto</code></td>
- <td align="left">Add background under slide title automatically for h1 header elements. If not enabled, use <code>class: header_background</code> to enable</td>
- <td align="left"></td>
- <td align="left">FALSE</td>
- </tr>
- <tr class="odd">
- <td align="left"><code>header_background_color</code></td>
- <td align="left">Background Color for h1 Header with Background</td>
- <td align="left">.remark-slide-content h1</td>
- <td align="left">header_color</td>
- </tr>
- <tr class="even">
- <td align="left"><code>header_background_text_color</code></td>
- <td align="left">Text Color for h1 Header with Background</td>
- <td align="left">.remark-slide-content h1</td>
- <td align="left">background_color</td>
- </tr>
- <tr class="odd">
- <td align="left"><code>header_background_padding</code></td>
- <td align="left">Padding for h1 Header with Background</td>
- <td align="left">.remark-slide-content h1</td>
- <td align="left">NULL</td>
- </tr>
- <tr class="even">
- <td align="left"><code>header_background_content_padding_top</code></td>
- <td align="left">Top Padding for Content in Slide with Header with Background</td>
- <td align="left">.remark-slide-content</td>
- <td align="left">7rem</td>
- </tr>
- <tr class="odd">
- <td align="left"><code>header_background_ignore_classes</code></td>
- <td align="left">Slide Classes Where Header with Background will not be Applied</td>
- <td align="left">.remark-slide-content</td>
- <td align="left">c(‘normal’, ‘inverse’, ‘title’, ‘middle’, ‘bottom’)</td>
- </tr>
- <tr class="even">
- <td align="left"><code>text_slide_number_font_size</code></td>
- <td align="left">Slide Number Text Font Size</td>
- <td align="left">.remark-slide-number</td>
- <td align="left">0.9rem</td>
- </tr>
- <tr class="odd">
- <td align="left"><code>text_font_google</code></td>
- <td align="left">Use <code><a href="../reference/google_font.html">google_font()</a></code> to specify body font</td>
- <td align="left">body</td>
- <td align="left">NULL</td>
- </tr>
- <tr class="even">
- <td align="left"><code>text_font_family</code></td>
- <td align="left">Body Text Font Family (xaringan default is <code>'Droid Serif'</code>)</td>
- <td align="left">body</td>
- <td align="left">Noto Sans</td>
- </tr>
- <tr class="odd">
- <td align="left"><code>text_font_weight</code></td>
- <td align="left">Body Text Font Weight</td>
- <td align="left">body</td>
- <td align="left">normal</td>
- </tr>
- <tr class="even">
- <td align="left"><code>text_font_url</code></td>
- <td align="left">Body Text Font URL(s)</td>
- <td align="left">
- <span class="citation">@import</span> url()</td>
- <td align="left"><a href="https://fonts.googleapis.com/css?family=Noto+Sans:400,400i,700,700i&display=swap" class="uri">https://fonts.googleapis.com/css?family=Noto+Sans:400,400i,700,700i&display=swap</a></td>
- </tr>
- <tr class="odd">
- <td align="left"><code>text_font_family_fallback</code></td>
- <td align="left">Body Text Font Fallbacks</td>
- <td align="left">body</td>
- <td align="left">-apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, Ubuntu, roboto, noto, segoe ui, arial</td>
- </tr>
- <tr class="even">
- <td align="left"><code>text_font_base</code></td>
- <td align="left">Body Text Base Font (Total Failure Fallback)</td>
- <td align="left">body</td>
- <td align="left">sans-serif</td>
- </tr>
- <tr class="odd">
- <td align="left"><code>header_font_google</code></td>
- <td align="left">Use <code><a href="../reference/google_font.html">google_font()</a></code> to specify header font</td>
- <td align="left">body</td>
- <td align="left">NULL</td>
- </tr>
- <tr class="even">
- <td align="left"><code>header_font_family</code></td>
- <td align="left">Header Font Family (xaringan default is <code>'Yanone Kaffeesatz'</code>)</td>
- <td align="left">h1, h2, h3</td>
- <td align="left">Cabin</td>
- </tr>
- <tr class="odd">
- <td align="left"><code>header_font_weight</code></td>
- <td align="left">Header Font Weight</td>
- <td align="left">h1, h2, h3</td>
- <td align="left">600</td>
- </tr>
- <tr class="even">
- <td align="left"><code>header_font_url</code></td>
- <td align="left">Header Font URL</td>
- <td align="left">
- <span class="citation">@import</span> url</td>
- <td align="left"><a href="https://fonts.googleapis.com/css?family=Cabin:600,600i&display=swap" class="uri">https://fonts.googleapis.com/css?family=Cabin:600,600i&display=swap</a></td>
- </tr>
- <tr class="odd">
- <td align="left"><code>code_font_google</code></td>
- <td align="left">Use <code><a href="../reference/google_font.html">google_font()</a></code> to specify code font</td>
- <td align="left">body</td>
- <td align="left">NULL</td>
- </tr>
- <tr class="even">
- <td align="left"><code>code_font_family</code></td>
- <td align="left">Code Font Family</td>
- <td align="left">.remark-code, .remark-inline-code</td>
- <td align="left">Source Code Pro</td>
- </tr>
- <tr class="odd">
- <td align="left"><code>code_font_size</code></td>
- <td align="left">Code Text Font Size</td>
- <td align="left">.remark-inline</td>
- <td align="left">0.9rem</td>
- </tr>
- <tr class="even">
- <td align="left"><code>code_font_url</code></td>
- <td align="left">Code Font URL</td>
- <td align="left">
- <span class="citation">@import</span> url</td>
- <td align="left"><a href="https://fonts.googleapis.com/css?family=Source+Code+Pro:400,700&display=swap" class="uri">https://fonts.googleapis.com/css?family=Source+Code+Pro:400,700&display=swap</a></td>
- </tr>
- <tr class="odd">
- <td align="left"><code>code_font_family_fallback</code></td>
- <td align="left">Code Font Fallback</td>
- <td align="left">.remark-code, .remark-inline-code</td>
- <td align="left">Menlo, Consolas, Monaco, Liberation Mono, Lucida Console</td>
- </tr>
- </tbody>
- </table>
- </div>
-
- <div class="col-md-3 hidden-xs hidden-sm" id="sidebar">
-
- </div>
-
- </div>
-
-
-
- <footer><div class="copyright">
- <p>Developed by <a href="https://www.garrickadenbuie.com">Garrick Aden-Buie</a>.</p>
- </div>
-
- <div class="pkgdown">
- <p>Site built with <a href="https://pkgdown.r-lib.org/">pkgdown</a> 1.4.1.</p>
- </div>
-
- </footer>
- </div>
-
-
-
-
- </body>
- </html>
|