Color & contrast

Enter an opaque sRGB color as #RGB or #RRGGBB, or use the color picker. All results update live.

Click a value to copy it. Color spaces gives selectable CSS values for RGB, HSL, Lab (D50) and OKLCH. HSV is shown as hue / saturation / value, not a CSS function. Lab adapts sRGB D65 to D50; achromatic OKLCH colors use hue zero. Displayed values are rounded.

Contrast compares two opaque colors using WCAG 2 relative luminance. Pass/fail uses the unrounded ratio: AA requires 4.5:1 for normal text and 3:1 for large text; AAA requires 7:1 and 4.5:1. Large means at least 18 pt (24 CSS px), or 14 pt (about 18.67 CSS px) bold. The two samples show both foreground/background directions; their displayed size does not determine the large-text verdict. Transparency, surrounding colors and other accessibility criteria are not evaluated.

Palette rotates HSL hue; monochrome varies HSL lightness. These are simple color harmonies, not guaranteed accessible pairs or perceptually uniform steps. Click a swatch to copy its HEX code.

Only the exact two color texts and chosen harmony use the shared browser store, including empty or invalid drafts up to 32 characters per field. Conversions, verdicts, samples, palettes, copy status and the active section are not saved. Reload recomputes from the inputs and opens Color spaces. Reset restores both default colors and complementary harmony without changing the current section. A storage warning means edits may remain only in memory.