<!-- SPDX-License-Identifier: MIT -->
<!-- SPDX-FileCopyrightText: 2025-2026 Marcus Quinn -->

# Design System: Linear

Dark-mode-native product design system. Near-black canvas (`#08090a`), Inter Variable with OpenType features, single brand accent (indigo-violet), semi-transparent white borders throughout.

## Chapters

| File | Contents |
|------|----------|
| [01-visual-theme.md](01-visual-theme.md) | Visual theme & atmosphere, key characteristics |
| [02-colour-palette.md](02-colour-palette.md) | Full colour palette with roles — backgrounds, text, brand, status, borders, overlays |
| [03-typography.md](03-typography.md) | Font families, full type hierarchy table, principles |
| [04-components.md](04-components.md) | Buttons, cards, inputs, badges, navigation, image treatment |
| [05-layout.md](05-layout.md) | Spacing system, grid, whitespace philosophy, border radius scale |
| [06-depth-elevation.md](06-depth-elevation.md) | Elevation levels, shadow philosophy, luminance stacking |
| [07-dos-and-donts.md](07-dos-and-donts.md) | Do's and don'ts — the rules that define the system |
| [08-responsive.md](08-responsive.md) | Breakpoints, touch targets, collapsing strategy, image behavior |
| [09-agent-prompts.md](09-agent-prompts.md) | Quick color reference, example component prompts, iteration guide |

## Quick Reference

**Backgrounds:** `#08090a` (marketing) · `#0f1011` (panel) · `#191a1b` (elevated) · `#28282c` (hover)

**Text:** `#f7f8f8` (primary) · `#d0d6e0` (secondary) · `#8a8f98` (tertiary) · `#62666d` (quaternary)

**Brand:** `#5e6ad2` (indigo bg) · `#7170ff` (accent) · `#828fff` (hover)

**Borders:** `rgba(255,255,255,0.05)` (subtle) · `rgba(255,255,255,0.08)` (standard)

**Typography:** Inter Variable `"cv01", "ss03"` · weights 400/510/590 · Berkeley Mono for code

**Key rule:** Weight 510 is the signature emphasis weight. Brand indigo is the only chromatic color. Borders are always semi-transparent white, never solid dark.
