Color Converter

HEX, RGB/RGBA, HSL/HSLA, HSV and CSS color names — every field live-linked, alpha included.

Runs 100% in your browserNothing is uploaded to a serverFree forever

Color

100%

Formats

Copied!

Every field is live: edit any one and the other three follow. Drop the alpha below 100% and the hex grows its AA pair; paste an #RRGGBBAA value and the slider moves to match.

About this color converter

Paste a color in any notation a stylesheet accepts — #3ce688, 3ce688, #3ce688cc, rgb(60 230 136), rgba(60, 230, 136, .8), hsl(147 77% 57%), hsv(147 74% 90%), or a CSS name like rebeccapurple — and every other format updates as you type. All 148 CSS named colors are recognised in both directions, so an exact match is named back to you rather than left as a hex string.

HSL and HSV are not the same thing. Both start from the same hue angle, but HSL's third number is lightness (pure red is 50% — white and black sit at the two ends) while HSV's is value (pure red is 100%). That is why a color picker's square-and-slider is HSV and a stylesheet's is HSL, and why the same color reports two different-looking triples here. Neither is wrong; they answer different questions.

Alpha travels with the color. An eight-digit hex is #RRGGBBAA, where the last pair is the alpha channel as a byte: 80 is 50%, cc is 80%, ff is opaque. Fully opaque colors are emitted as six digits, because a trailing ff is noise. The swatch sits on a checkerboard so a translucent color reads as translucent instead of as a slightly different flat color.

Everything runs locally in your browser — no color you paste is ever uploaded. Checking a pair of colors for legibility rather than converting one? Use the WCAG contrast checker, which shares this page's color maths.

More developer tools