git:20260404.1101a98 to git:20260404.2e83279
3 added, 0 removed. Audit A to A.
+ <!-- SPDX-License-Identifier: MIT -->
+ <!-- SPDX-FileCopyrightText: 2025-2026 Marcus Quinn -->
+
# Design System: Claude (Anthropic)
Reference corpus for Claude's visual identity. Each chapter is a self-contained reference file.
## Chapters
| # | File | Contents |
|---|------|----------|
| 1 | [01-visual-theme.md](01-visual-theme.md) | Visual theme & atmosphere, key characteristics |
| 2 | [02-color-palette.md](02-color-palette.md) | Full color palette: primary, surface, neutrals, semantic, gradients |
| 3 | [03-typography.md](03-typography.md) | Font families, type hierarchy table, typographic principles |
| 4 | [04-components.md](04-components.md) | Buttons, cards, inputs, navigation, image treatment, distinctive components |
| 5 | [05-layout.md](05-layout.md) | Spacing system, grid, whitespace, border radius scale, responsive behavior |
| 6 | [06-depth-elevation.md](06-depth-elevation.md) | Elevation levels, shadow philosophy, decorative depth |
| 7 | [07-dos-and-donts.md](07-dos-and-donts.md) | Do's and don'ts — brand compliance rules |
| 8 | [08-agent-prompt-guide.md](08-agent-prompt-guide.md) | Quick color reference, example component prompts, iteration guide |
## Quick Reference
**Brand identity in one sentence:** Warm parchment canvas (`#f5f4ed`), Anthropic Serif headlines at weight 500, terracotta CTA (`#c96442`), ring shadows (`0px 0px 0px 1px`), exclusively warm-toned neutrals.
**Core palette:**
| Token | Hex | Role |
|-------|-----|------|
| Parchment | `#f5f4ed` | Page background |
| Ivory | `#faf9f5` | Card surface |
| Anthropic Near Black | `#141413` | Primary text / dark surface |
| Terracotta Brand | `#c96442` | Primary CTA |
| Olive Gray | `#5e5d59` | Secondary text |
| Border Cream | `#f0eee6` | Light-theme borders |
| Dark Surface | `#30302e` | Dark-theme containers |
**Typography:** Anthropic Serif (headlines, weight 500) / Anthropic Sans (UI) / Anthropic Mono (code). Body line-height: 1.60.
**Do not:** use cool blue-grays, bold serifs (>500), sharp corners (<6px), heavy drop shadows, or pure white backgrounds.