Pickers & Converters·free · no signup

HEX ↔ RGB ↔ HSL Converter

Convert a color between every format at once — HEX, RGB, HSL, HSV, CMYK and OKLCH. Edit any one and the rest update live.

Royal Violet
HEX
#
RGB
R
G
B
HSL
H
S
L
All formats
CSS
color.css
/* HEX   */ color: #7C5CFF;
/* RGB   */ color: rgb(124, 92, 255);
/* HSL   */ color: hsl(252, 100%, 68%);
/* OKLCH */ color: oklch(0.599 0.230 286.2);

How to use the HEX ↔ RGB ↔ HSL

All formats describe one underlying color, so the tool converts by parsing your input into RGB and then re-projecting it into each model. HEX is hexadecimal RGB; HSL and HSV reorganize the same data into hue/saturation/lightness or value; OKLCH places it in a perceptual lightness–chroma–hue space. Because the math is reversible, editing any field round-trips cleanly to the rest.

  1. 1
    Enter a value

    Paste or type a color in any field — for example #3DB9FF, rgb(61, 185, 255) or hsl(201, 100%, 62%).

  2. 2
    Read every format

    The other formats recompute immediately and the preview swatch shows the exact color.

  3. 3
    Copy the one you need

    Click a result to copy it, ready to drop into CSS, Sass, Figma or your codebase.

Frequently asked

How do I convert HEX to RGB?
Paste the HEX value and read the RGB field. Each pair of hex digits maps to one 0–255 channel: #3DB9FF is rgb(61, 185, 255).
What is the difference between HSL and HSV?
Both start from hue and saturation, but HSL ends in lightness (50% is the pure hue, 100% is white) while HSV ends in value (100% is the pure hue, brighter). They are similar but not interchangeable.
Why would I use OKLCH instead of HSL?
OKLCH is perceptually uniform, so adjusting lightness or chroma changes the color by the amount your eye expects — useful for building even tonal scales where HSL can look uneven.
Can I convert colors with transparency?
Yes. Include an alpha channel (such as an 8-digit HEX or rgba value) and it is preserved across the rgba()/hsla() outputs.

More pickers & converters

Color Picker
Pick any color and get HEX, RGB, HSL and OKLCH values, with live harmonies and WCAG contrast. Free, instant, no signup.
Color Name Finder
Find the name of any color, and the HEX of any named color.
Color Mixer
Mix two colors together and see the blended result at any ratio.