pr_01m47d24b0e6n91zwymwxg0vpx/packages/theme/tokens.css
| 1 | /* |
| 2 | * g1t's design tokens. Every public site (the app, the docs) takes its |
| 3 | * colours and type from here, so a change lands everywhere at once. |
| 4 | * Each site maps these onto whatever its own framework calls them. |
| 5 | */ |
| 6 | :root { |
| 7 | /* The faces themselves are in fonts.css. */ |
| 8 | --g1t-font-sans: 'Hanken Grotesk', 'Hanken Grotesk Fallback', ui-sans-serif, system-ui, sans-serif, |
| 9 | 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'; |
| 10 | --g1t-font-display: 'Bricolage Grotesque', 'Bricolage Grotesque Fallback', ui-sans-serif, system-ui, |
| 11 | sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'; |
| 12 | --g1t-font-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; |
| 13 | |
| 14 | /* Very dark gray, nearly neutral, three elevations. */ |
| 15 | --g1t-bg: #0f0f11; |
| 16 | --g1t-surface: #161618; |
| 17 | --g1t-raised: #1e1e21; |
| 18 | --g1t-line: #28282c; |
| 19 | --g1t-line-strong: #38383e; |
| 20 | |
| 21 | --g1t-fg: #ededef; |
| 22 | --g1t-fg-soft: #dcdce0; |
| 23 | --g1t-muted: #a0a0a8; |
| 24 | --g1t-faint: #86868e; |
| 25 | |
| 26 | /* Mint: what is live, what passed, what was added. */ |
| 27 | --g1t-accent: #86efc4; |
| 28 | --g1t-accent-dim: #4fb38e; |
| 29 | --g1t-accent-low: #10302a; |
| 30 | |
| 31 | /* Accents: lavender and peach, for art and for status. */ |
| 32 | --g1t-info: #8ab4ff; |
| 33 | --g1t-merged: #b6a8ff; |
| 34 | --g1t-warn: #ffbd8c; |
| 35 | --g1t-danger: #ff8394; |
| 36 | } |