Theme Library

Every Vanilla Breeze theme ships as a CSS file at /cdn/themes/{slug}.css and as a DTCG sibling at {slug}.tokens.json. Themes with an explicit dark-mode variant also ship {slug}-dark.tokens.json.

Loading manifest…

The library requires JavaScript to render the table. The raw manifest is available at /cdn/themes/manifest.json.

Brand reference themes

The brand themes (mcdonalds, starbucks, ibm, anthropic) are reference interpretations of public brand cues, intended for design-system demonstration. Trademarks belong to their respective owners; each theme is a single removable file. See the disclaimer in any src/tokens/themes/_brand-{name}.css file for full text.

How to use

Load the CSS as a stylesheet and set data-theme on the root element to activate it:

<link rel="stylesheet" href="https://vanilla-breeze.com/cdn/themes/dracula.css">
<html data-theme="dracula">

Or import the DTCG into <theme-import> to apply tokens dynamically. The Theme Composer exposes both flows.