😎 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.

162 satır
9.1KB

  1. <!DOCTYPE html>
  2. <!-- Generated by pkgdown: do not edit by hand --><html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  5. <meta charset="utf-8">
  6. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  7. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  8. <title>Fonts • xaringanthemer</title>
  9. <!-- jquery --><script src="https://code.jquery.com/jquery-3.1.0.min.js" integrity="sha384-nrOSfDHtoPMzJHjVTdCopGqIqeYETSXhZDFyniQ8ZHcVy08QesyHcnOUpMpqnmWq" crossorigin="anonymous"></script><!-- Bootstrap --><link href="https://maxcdn.bootstrapcdn.com/bootswatch/3.3.7/yeti/bootstrap.min.css" rel="stylesheet" crossorigin="anonymous">
  10. <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script><!-- Font Awesome icons --><link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-T8Gy5hrqNKT+hzMclPo118YTQO6cYprQmhrYwIiQ/3axmI1hQomh7Ud2hPOy8SP1" crossorigin="anonymous">
  11. <!-- clipboard.js --><script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/1.7.1/clipboard.min.js" integrity="sha384-cV+rhyOuRHc9Ub/91rihWcGmMmCXDeksTtCihMupQHSsi8GIIRDG0ThDc3HGQFJ3" crossorigin="anonymous"></script><!-- pkgdown --><link href="../../pkgdown.css" rel="stylesheet">
  12. <script src="../../jquery.sticky-kit.min.js"></script><script src="../../pkgdown.js"></script><meta property="og:title" content="Fonts">
  13. <meta property="og:description" content="">
  14. <meta name="twitter:card" content="summary">
  15. <!-- mathjax --><script src="https://mathjax.rstudio.com/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script><!--[if lt IE 9]>
  16. <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
  17. <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
  18. <![endif]-->
  19. </head>
  20. <body>
  21. <div class="container template-article">
  22. <header><div class="navbar navbar-default navbar-fixed-top" role="navigation">
  23. <div class="container">
  24. <div class="navbar-header">
  25. <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar">
  26. <span class="icon-bar"></span>
  27. <span class="icon-bar"></span>
  28. <span class="icon-bar"></span>
  29. </button>
  30. <span class="navbar-brand">
  31. <a class="navbar-link" href="../../index.html">xaringanthemer</a>
  32. <span class="label label-default" data-toggle="tooltip" data-placement="bottom" title="Released package">0.1.0.9000</span>
  33. </span>
  34. </div>
  35. <div id="navbar" class="navbar-collapse collapse">
  36. <ul class="nav navbar-nav">
  37. <li>
  38. <a href="../../index.html">
  39. <span class="fa fa-home fa-lg"></span>
  40. </a>
  41. </li>
  42. <li>
  43. <a href="../../articles/xaringanthemer.html">Get started</a>
  44. </li>
  45. <li>
  46. <a href="../../articles/singles/themes.html">Themes</a>
  47. </li>
  48. <li>
  49. <a href="../../articles/singles/fonts.html">Fonts</a>
  50. </li>
  51. <li>
  52. <a href="../../articles/template-variables.html">Template Variables</a>
  53. </li>
  54. <li>
  55. <a href="../../articles/css-help.html">CSS Help</a>
  56. </li>
  57. <li>
  58. <a href="../../reference/index.html">Reference</a>
  59. </li>
  60. <li class="dropdown">
  61. <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
  62. Articles
  63. <span class="caret"></span>
  64. </a>
  65. <ul class="dropdown-menu" role="menu">
  66. <li>
  67. <a href="../../articles/css-help.html">xaringanthemer CSS Help</a>
  68. </li>
  69. <li>
  70. <a href="../../articles/singles/fonts.html">Fonts</a>
  71. </li>
  72. <li>
  73. <a href="../../articles/singles/themes.html">Themes</a>
  74. </li>
  75. <li>
  76. <a href="../../articles/template-variables.html">Template Variables</a>
  77. </li>
  78. </ul>
  79. </li>
  80. </ul>
  81. <ul class="nav navbar-nav navbar-right">
  82. <li>
  83. <a href="https://github.com/gadenbuie/xaringanthemer">
  84. <span class="fa fa-github fa-lg"></span>
  85. </a>
  86. </li>
  87. <li>
  88. <a href="https://twitter.com/grrrck">
  89. <span class="fa fa-twitter fa-lg"></span>
  90. </a>
  91. </li>
  92. </ul>
  93. </div>
  94. <!--/.nav-collapse -->
  95. </div>
  96. <!--/.container -->
  97. </div>
  98. <!--/.navbar -->
  99. </header><div class="row">
  100. <div class="col-md-9 contents">
  101. <div class="page-header toc-ignore">
  102. <h1>Fonts</h1>
  103. <small class="dont-index">Source: <a href="https://github.com/gadenbuie/xaringanthemer/blob/master/vignettes/singles/fonts.Rmd"><code>vignettes/singles/fonts.Rmd</code></a></small>
  104. <div class="hidden name"><code>fonts.Rmd</code></div>
  105. </div>
  106. <!-- Need to set [adding-custom-css] -->
  107. <p>Yihui picked out great fonts for the <a href="https://slides.yihui.name/xaringan/">default xaringan theme</a>, but sometimes you want something new and interesting.</p>
  108. <p><strong>xaringanthemer</strong> makes it easy to use <a href="https://fonts.google.com">Google Fonts</a> in your presentations (well, as long as you have an internet connection) or to fully specify your font files.</p>
  109. <p>To use <a href="https://fonts.google.com">Google Fonts</a>, set the <code>_font_google</code> theme arguments – <code>text_font_google</code>, <code>header_font_google</code>, <code>code_font_google</code> — using the <code><a href="../../reference/google_font.html">google_font()</a></code> helper. See <code><a href="../../reference/google_font.html">?google_font</a></code> for more info.</p>
  110. <div class="sourceCode" id="cb1"><pre class="sourceCode r"><code class="sourceCode r"><a class="sourceLine" id="cb1-1" data-line-number="1"><span class="kw"><a href="../../reference/mono_light.html">mono_light</a></span>(</a>
  111. <a class="sourceLine" id="cb1-2" data-line-number="2"> <span class="dt">header_font_google =</span> <span class="kw"><a href="../../reference/google_font.html">google_font</a></span>(<span class="st">"Josefin Slab"</span>, <span class="st">"600"</span>),</a>
  112. <a class="sourceLine" id="cb1-3" data-line-number="3"> <span class="dt">text_font_google =</span> <span class="kw"><a href="../../reference/google_font.html">google_font</a></span>(<span class="st">"Work Sans"</span>, <span class="st">"300"</span>, <span class="st">"300i"</span>),</a>
  113. <a class="sourceLine" id="cb1-4" data-line-number="4"> <span class="dt">code_font_google =</span> <span class="kw"><a href="../../reference/google_font.html">google_font</a></span>(<span class="st">"IBM Plex Mono"</span>)</a>
  114. <a class="sourceLine" id="cb1-5" data-line-number="5">)</a></code></pre></div>
  115. <p>If you set an <code>xxx_font_google</code> theme arguments, then <code>xxx_font_family</code>, <code>xxx_font_weight</code> and <code>xxx_font_url</code> are overwritten – where <code>xxx</code> in <code>{header, text, code}</code>. Of course, you can manually set <code>header_font_url</code>, etc., and ignore the <code>header_font_google</code> argument.</p>
  116. <p>For example, suppose you want to use a ligature font for the code font, such as <a href="https://github.com/yihui/xaringan/issues/83">Fira Code</a>. Just set <code>code_font_family</code> and <code>code_font_url</code>!</p>
  117. <div class="sourceCode" id="cb2"><pre class="sourceCode r"><code class="sourceCode r"><a class="sourceLine" id="cb2-1" data-line-number="1"><span class="kw"><a href="../../reference/solarized_dark.html">solarized_dark</a></span>(</a>
  118. <a class="sourceLine" id="cb2-2" data-line-number="2"> <span class="dt">code_font_family =</span> <span class="st">"Fira Code"</span>,</a>
  119. <a class="sourceLine" id="cb2-3" data-line-number="3"> <span class="dt">code_font_url =</span> <span class="st">"https://cdn.rawgit.com/tonsky/FiraCode/1.204/distr/fira_code.css"</span></a>
  120. <a class="sourceLine" id="cb2-4" data-line-number="4">)</a></code></pre></div>
  121. <p>If you need to import additional fonts for use in <a href="xaringanthemer.html#adding-custom-css">custom CSS definitions</a>, you can use the <code>extra_fonts</code> argument to pass a list of URLs or <code><a href="../../reference/google_font.html">google_font()</a></code>s.</p>
  122. <div class="sourceCode" id="cb3"><pre class="sourceCode r"><code class="sourceCode r"><a class="sourceLine" id="cb3-1" data-line-number="1"><span class="kw"><a href="../../reference/mono_light.html">mono_light</a></span>(</a>
  123. <a class="sourceLine" id="cb3-2" data-line-number="2"> <span class="dt">extra_fonts =</span> <span class="kw">list</span>(<span class="kw"><a href="../../reference/google_font.html">google_font</a></span>(<span class="st">"Sofia"</span>)),</a>
  124. <a class="sourceLine" id="cb3-3" data-line-number="3"> <span class="dt">extra_css =</span> <span class="kw">list</span>(<span class="st">".title-slide h2"</span> =<span class="st"> </span><span class="kw">list</span>(<span class="st">"font-family"</span> =<span class="st"> "Sofia"</span>))</a>
  125. <a class="sourceLine" id="cb3-4" data-line-number="4">)</a></code></pre></div>
  126. </div>
  127. <div class="col-md-3 hidden-xs hidden-sm" id="sidebar">
  128. </div>
  129. </div>
  130. <footer><div class="copyright">
  131. <p>Developed by <a href="https://www.garrickadenbuie.com">Garrick Aden-Buie</a>.</p>
  132. </div>
  133. <div class="pkgdown">
  134. <p>Site built with <a href="http://pkgdown.r-lib.org/">pkgdown</a>.</p>
  135. </div>
  136. </footer>
  137. </div>
  138. </body>
  139. </html>