Themes

Five themes ship with Vitrine, all checked for WCAG AA contrast. Set theme="…" on an element, or Vitrine.configure({ theme }) for the whole page.

Syntax themes

258 code color schemes from highlight.js, loaded only when used. The interface keeps its theme; the code area takes the syntax theme. Each theme shows the lowest contrast of its colors: aim for 4.5:1 or more.

    Make your own

    Start from a theme, change the colors, and copy the code. Every text color is checked against its background as you go.