Pick colors with HEX and HSL, explore complementary and triadic harmonies, check WCAG contrast, and copy ready‑made CSS custom properties.
Core specimen
Harmonic field
Inclusive contrast lab
CSS token export
Spectrometer reflects your HEX across surfaces while preserving Codeground AI chrome tokens.
This color picker merges accessibility checks with exploratory palettes. Designers can articulate hues through whichever mental model resonates—hex for delivery artifacts, sliders for iterative tuning—and instantly evaluate WCAG conformance against configurable canvases resembling your production shells.
Harmony explorers unlock palettes that remained trapped inside native OS pickers: complementary tension, triadic vibrancy, analogous tranquility, or split complements for asymmetric marketing gradients.
Anchor with the native eyedropper‑equivalent picker for rapid capture, refine through HSL for perceptual uniformity, then snapshot harmonies for stakeholder decks. Drop exported CSS blocks directly into Angular or React themes; variable names intentionally stay framework agnostic (--cg-*) until your design‑token pipeline renames them.