view design_system/THEMES.md @ 279:b3b547563ec7

Add Google connector service and agent wiki Implement the C/Seobeo Google Drive and Gmail connector with encrypted OAuth storage, Zenbu authentication, browser testing, AI tool discovery, chunked HTTP decoding, and Bazel coverage. Consolidate repository guidance into progressive wiki documentation and enforce arena-first allocation for new first-party C code. Co-authored-by: Copilot <[email protected]> Copilot-Session: 84c338fd-0939-4bb3-b7f3-1062eb213e5d
author MrJuneJune <me@mrjunejune.com>
date Mon, 17 Aug 2026 22:22:36 -0700
parents 667156fcd3e3
children
line wrap: on
line source

# Zenbu UI themes

Themes are named token compositions, not separate component stylesheets.
Applications select one with `data-zen-theme` on the document root:

```html
<html data-zen-theme="paper">
```

Built-in themes:

- `paper`: warm neutral surfaces, restrained natural accents, editorial type;
- `ink`: dark charcoal surfaces with paper-like text and softer status colors;
- `playful`: brighter clay, persimmon, violet, and rounded shapes;
- `cyberpunk`: midnight surfaces with neon cyan, magenta, violet, yellow, and
  mint roles;
- no attribute: follow the operating-system light/dark preference.

Applications can provide their own fonts without changing component CSS:

```css
:root {
  --zenbu-font-editorial: "More Thin", sans-serif;
  --zenbu-font-playful: "More", sans-serif;
}
```

Import `themes.css` after `tokens.css` and before component CSS. Components
continue to consume semantic tokens, so every built-in and application theme
inherits the same accessibility, motion, and native-HTML behavior.