GuidelinesGuidelinesThe design tokens every component on this platform is built from. Change a value in app/globals.css and every page updates.
A deliberately small palette: two backgrounds, two borders, two text colors, and a single accent. No dark mode — this platform is strictly light.
Accent is primary-70 from the Chandra Asri brand palette — see the full 13-step scale (primary, navy, cyan, yellow, success, danger, purple, gray, dark) plus gradients and shadows on the Style Guide page.
Satoshi (the guideline's interface font) for interface and body text, JetBrains Mono for code. Headers use tight tracking for contrast against body copy.
Heading 1 / 36px
Heading 2 / 24px
Heading 3 / 18px
Body text / 16px — Deep Slate Black
Secondary text / 14px — Muted Slate Gray
const accent = "#2475B8"; // JetBrains Mono
Two radii cover every surface in this system: 6px for tight elements like badges, 8px for cards and containers.
Base primitives shared across every page — full variants and copy-ready source for each live under Base Components in the sidebar.
