Convert HEX, RGB, HSL and OKLCH, check WCAG contrast and generate tint scales.
Runs entirely in your browser. Nothing you type or paste is sent anywhere.
Build linear, radial and conic CSS gradients visually.
Layered CSS box shadows with a live preview.
Convert px, rem and em, and build clamp() values for fluid typography.
HEX (3, 4, 6 or 8 digits), rgb(), hsl(), oklch(), oklab(), hwb() or a name such as rebeccapurple.
Read as HEX
#0e7490#0e7490ff#rrggbbaa — the last pair is opacity.
rgb(14 116 144)hsl(192.9 82.3% 31%)oklch(51.98% 0.0936 223.13)Perceptual lightness, chroma and hue.
cmyk(90%, 19%, 0%, 44%)Approximate: a naive formula with no colour profile. Ask your printer for real values.
Large text at 24px
Normal text at 16px. The quick brown fox jumps over the lazy dog — 0123456789.
Small text at 14px is the hardest to read.
5.35:1
Passes AA for all text sizes.
Built in OKLCH: each step sets a lightness, the hue stays fixed, and chroma is kept where sRGB allows and clamped to the gamut edge where it doesn’t. Your colour sits unchanged at step 700. W and B are contrast ratios against white and black text — green means 4.5:1 or more. Select a swatch to copy its value.