Skip to content

Changing the colors

If you install the documentation on your local machine, you can pick the colors of your choice. The colors can be set from mkdocs.yml located in the docs/ folder

Color scheme

Our documenation supports two color schemes: a light mode, which is just called default, and a dark mode, which is called slate. The color scheme can be set from mkdocs.yml:

theme:
  palette:
    scheme: default

click on a tile to change the color scheme:

Primary color

The primary color is used for the header, the sidebar, text links and several other components. In order to change the primary color, set the following value in mkdocs.yml to a valid color name:

theme:
  palette:
    primary: indigo

click on a tile to change the primary color:

Accent color

The accent color is used to denote elements that can be interacted with, e.g. hovered links, buttons and scrollbars. It can be changed in mkdocs.yml by chosing a valid color name:

theme:
  palette:
    accent: indigo

click on a tile to change the accent color:


Accessibility – not all color combinations work well

With 2 (color schemes) x 21 (primary colors) x 17 (accent color) = 714 combinations, it's impossible to ensure that all configurations provide a good user experience (e.g. yellow on light background), so make sure that the color combination of your choosing provides enough contrast and tweak CSS variables where necessary.