Color schemes

Pre-defined color combinations for backgrounds, text, and accents. Apply to any container to change its color context.

Available schemes

Each scheme sets 8 semantic tokens: --color-bg, --color-fg, --color-accent, --color-accent2, --color-muted, --color-subtle, --color-border, --color-border-muted.

Code

<!-- Light mode (applied to body by default) -->
<body class="scheme-default">...</body>

<!-- Subtle variant -->
<div class="scheme-subtle">...</div>

<!-- Dark mode (manual override) -->
<section class="scheme-dark">...</section>

<!-- Status schemes -->
<div class="scheme-danger">...</div>
<div class="scheme-warning">...</div>
<div class="scheme-success">...</div>