🎨 Color Converter
Convert any color between HEX, RGB, RGBA, HSL, HSLA, and OKLCH formats instantly. Click the swatch to open a color picker, or type any value to convert.
FAQ
What is the difference between HEX and RGB?
HEX encodes each color channel (red, green, blue) as a two-digit hexadecimal number, e.g. #ff5733. RGB expresses the same values as decimal integers 0–255, e.g. rgb(255, 87, 51). Both describe the same sRGB color space.
What is HSL?
HSL stands for Hue, Saturation, Lightness. Hue is a degree on the color wheel (0–360°), Saturation is 0–100% (grey to full color), Lightness is 0–100% (black to white). HSL is intuitive for creating color palettes because you can shift the hue while keeping the same saturation and lightness.
What is OKLCH and why does it matter?
OKLCH (L = lightness, C = chroma, H = hue) is a perceptually uniform color space defined in CSS Color Level 4. Unlike HSL, equal numeric steps in OKLCH look equally different to the human eye — making it ideal for programmatically generating accessible, visually balanced color palettes.
What does the Alpha slider control?
Alpha (opacity) ranges from 0 (fully transparent) to 1 (fully opaque). It affects the RGBA and HSLA outputs. The HEX field also updates to 8-digit format when alpha is below 1.
Can I type directly into the input fields?
Yes — type any valid HEX, RGB, RGBA, HSL, or HSLA value and all other formats will update automatically. The color picker and preview swatch also update to match.