§ 004 · Color System
Color as environment, not decoration.
Four-tier palette system. Foundation tokens, Archival accents, Instrument data colors, Signal campaign hues. Each tier has a distinct purpose and a distinct context.
§ 004.04 · Contrast Reference
WCAG accessibility reference.
AA = 4.5:1 normal text · 3:1 large text · AAA = 7:1
| Text | Background | Ratio | Level | Notes |
|---|---|---|---|---|
| #1A1A1A | #F3F0ED | 17.0:1 | AAA | Body text on parchment |
| #2B2C2E | #F3F0ED | 12.3:1 | AAA | Charleston on parchment |
| #1A1A1A | #FFFFFF | 21.0:1 | AAA | Near-black on white |
| #1A1A1A | #4DB405 | 6.5:1 | AA | Dark text ON green — use this |
| #FFFFFF | #4DB405 | 2.7:1 | FAIL | White on green FAIL — avoid for small text |
| #52E619 | #0D1A0D | 9.1:1 | AAA | Phosphor on deep soil |
| #C4D9C8 | #0D1A0D | 9.8:1 | AAA | Nitrogen text on deep soil |
| #F5F5F0 | #1C1C1A | 17.2:1 | AAA | Flash white on carbon |
| #1C1C1A | #C7E55A | 8.1:1 | AAA | Carbon on electric lime |
| #9A8860 | #F3F0ED | 3.1:1 | AA | Gold — decorative labels only |
§ 004.05 · CSS Tokens
Copy/paste token system.
:root {
/* Foundation */
--green: #4DB405; /* Brand Green — primary CTA */
--charleston: #2B2C2E; /* Near-black text */
--parchment: #F3F0ED; /* Warm page bg */
/* Archive palette */
--bg: #F3F0ED;
--bg-alt: #E9E8EE;
--surface: #FFFFFF;
--gold: #9A8860; /* Catalog labels */
--terracotta: #C4654A; /* Error states */
--sage: #A0AF9A; /* Natural accent */
/* Instrument palette */
--deep-soil: #0D1A0D;
--instrument-green: #52E619; /* Phosphor — data readouts */
--signal-amber: #E8A020; /* Warnings */
--signal-red: #E83030; /* Alerts */
--nitrogen: #C4D9C8; /* Dark-bg text */
/* Signal palette */
--electric-lime: #C7E55A;
--carbon: #1C1C1A;
--flash-white: #F5F5F0;
}