T
Theme Studio
Design tokens for HTML reports · live preview

Presets

click to apply · then tweak any token

A preset is just quick tokens. Most brand presets also have a full design spec — ask the agent to read design-packs/<brand>/DESIGN.md for deep fidelity.

Accent

Strong & weak auto-derive from the base accent. Edit them to override.

Font

Neutrals

Semantic

Look

Shape, density, surfaces & type. Defaults match today's look, so an untouched Look adds nothing to the export.

Prose 68ch

Fills the four Semantic pickers above — still individually tweakable.

Switch the preview to Dark to see it.

Locale & numbers

Off = K / M / B scale. On = East-Asian 만 / 억 scale.

How to use this theme

Used for the filename and the commands below: custom.json

  1. 1 Pick a preset above, then tweak any token until the live preview looks right.
  2. 2 Name your theme.
  3. 3 Click Copy for agent and paste it to your AI agent (with the cookiebite skill) — it applies the theme to that report. To make it your default for every report, use Set as my default instead. Or use Download theme.json / Copy CSS for manual use.
  4. 4 Reuse by name: save the json as assets/presets/custom.json, then just say "use the custom theme".

Copies a self-contained prompt with the full theme.json inline — paste it to your AI agent (with the cookiebite skill) and it applies the theme.

Copies a prompt that saves this theme as your global default, so every future report uses it (until you change it). "Copy for agent" themes just one report; this themes them all.

Saves the raw token file for reuse — drop it into assets/presets/ to apply it by name later.

Manual fallback: paste this <link> + <style> + <script> block straight into the report's THEME block.

theme.json

live · read-only

      
Live preview
Copied!
Q2 FY26 Revenue

Quarterly Performance

Automated summary generated from the data pipeline.

Weekly bookings

last 8 weeks
Channel Amount Status