Custom Styling of a Distill Website

Distill CSS

Some Examples of CSS Tweaks I made to the Distill Theme

Sally A.M. Hogenboom

Custom Styling

I really love the Distill framework but have opted to make some custom styling changes. The process of adding custom styling (CSS) to your website is described in detail in their documentation.

In my own words the steps were as follows:

R Studio


If you also want to make the adjustments shown below, add the displayed CSS code to the theme.css file.

Reduce the spacing between bullet-points




/* Decrease spacing between elements of bullet lists */
/* 0.1em creates a small space between lines of text dependent on the font-size*/
d-article li, d-article ul, di-article ol {
  margin-bottom: 0.1em;


Text and figures are licensed under Creative Commons Attribution CC BY-NC-SA 4.0. The figures that have been reused from other sources don't fall under this license and can be recognized by a note in their caption: "Figure from ...".