Meridian — color.md

Color system. Ranking: influences.md.
Primary absorb: Fluent neutrals + brand sparingly + semantic status · Polaris assign meaning · Linear perceptual theme knobs · Meridian OKLCH-only + WCAG AA.

1. Laws

1. OKLCH only — tokens are oklch(...) or var(--token); never hex/rgb/hsl in components.
2. One accent — --brand drives primary, ring, selected, success.
3. Status ≠ brand — destructive / warning keep fixed meaning (Polaris, Fluent semantic).
4. Soft neutrals — never pure white/black.
5. Brand sparingly — CTA + selected wash; not large fills (Fluent brand).
6. Theater lifts brand — data-tone="theater" for AA on dock.
7. Activity pastels are semantic — agent doing, not accent fashion.

2. Palettes (Fluent → Meridian)

3. Theme knobs (Linear-shaped, OKLCH-strict)

Minimum knobs an agent may re-skin:

--brand
--brand-foreground
--brand-muted
--background
--foreground
--radius

Linear reduced theme definition to base + accent + contrast (Linear redesign). Meridian keeps explicit roles but one accent variable owns brand-linked aliases.

4. Neutral hierarchy

Fluent: lighter neutrals highlight focus areas (Color).

Limit accent tint in chrome calculations (Linear lesson).

5. Contrast contract

Audited pairs live in lib/design/contrast.ts. Gate: npm run check:contrast.

Body/UI ≥ 4.5:1; large/display ≥ 3:1.

6. Interaction coloring

7. Charts & activity

8. Anti-patterns

raw hex · arbitrary color utilities · second accent · neon · cream-terracotta cliché · pure white/black · status-as-decoration · influence brand labels

9. Implementation map

Sources

• Fluent 2 Color
• Fluent 2 Design tokens
• Polaris Pro
• Linear UI redesign