Utilities
Color Harmony & WCAG Contrast
Generate mathematical color harmonies (Analogous, Complementary, Triadic) with real WCAG 2.1 contrast ratios against the site's dark background.
HSL: 183°, 100%, 50%
Base
Complementary
Analogous 1
Analogous 2
Triadic 1
Triadic 2
WCAG 2.1 Contrast Report
Ratios are computed against the site background (#090a0e). AA requires ≥ 4.5:1 normal text or ≥ 3:1 large text; AAA requires ≥ 7:1.
| Swatch | Ratio | AA Normal | AA Large | AAA | On White |
|---|---|---|---|---|---|
| #00f2fe | 14.26:1 | PASS | PASS | AAA | Low |
| hsl(3, 100%, 50%) | 5.00:1 | PASS | PASS | — | Low |
| hsl(213, 100%, 50%) | 4.61:1 | PASS | PASS | — | Low |
| hsl(153, 100%, 50%) | 14.78:1 | PASS | PASS | AAA | Low |
| hsl(303, 100%, 50%) | 6.16:1 | PASS | PASS | — | Low |
| hsl(63, 100%, 50%) | 17.98:1 | PASS | PASS | AAA | Low |