6.9 Customize CSS styles

You can turn on/off some features of the Tufte style in HTML output. The default features enabled are:

---
output:
  tufte::tufte_html:
    tufte_features: ["fonts", "background", "italics"]
---

If you do not want the page background to be lightyellow, you can remove background from tufte_features. You can also customize the style of the HTML page via a CSS file. For example, if you do not want the subtitle to be italic, you can define

h3.subtitle em {
  font-style: normal;
}

in, say, a CSS file my-style.css (under the same directory of your Rmd document), and apply it to your HTML output via the css option, e.g.,

---
output:
  tufte::tufte_html:
    tufte_features: ["fonts", "background"]
    css: "my-style.css"
---

There is also a variant of the Tufte style in HTML/CSS named “Envisioned CSS.” This style can be enabled by specifying the argument tufte_variant = 'envisioned' in tufte_html(),7, e.g.,

---
output:
  tufte::tufte_html:
    tufte_variant: "envisioned"
---

You can see a live example at https://rstudio.github.io/tufte/. It is also available in Simplified Chinese: https://rstudio.github.io/tufte/cn/, and its envisioned style can be found at https://rstudio.github.io/tufte/envisioned/.

  1. The actual Envisioned CSS was not used in the tufte package. Only the fonts, background color, and text color are changed based on the default Tufte style.↩︎