HEX · RGB · HSL · HSV · CMYK
Color converter
The color #0060fd is rgb(0, 96, 253), hsl(217, 100%, 50%) and cmyk(100%, 62%, 0%, 1%). Type any CSS color or use the picker to convert your own.
- #0060fd = rgb(0, 96, 253)
- #0060fd = hsl(217, 100%, 50%)
- #0060fd = cmyk(100%, 62%, 0%, 1%)
- red = #ff0000
The tiles update as you type. If the text is not a color, an error appears and the last valid color stays on screen.
Scanned by 
NortonTM Safe Web
At a glance
- Price
- No charge
- Account
- None needed
- Upload
- Not applicable — you type a color, nothing is sent anywhere
- Input
- HEX (3, 4, 6 or 8 digits), rgb(), hsl(), hwb(), 148 CSS color names and transparent
- Output
- HEX, RGB, HSL, HSV, CMYK and the nearest CSS color name
- CMYK
- Mathematical conversion, not a print profile
Common colors in every model
These rows were produced by the same code as the converter. HSL, HSV and CMYK are rounded to whole numbers.
| Typed | HEX | RGB | HSL | HSV | CMYK |
|---|---|---|---|---|---|
| #0060fd | #0060fd | rgb(0, 96, 253) | hsl(217, 100%, 50%) | hsv(217, 100%, 99%) | cmyk(100%, 62%, 0%, 1%) |
| red | #ff0000 | rgb(255, 0, 0) | hsl(0, 100%, 50%) | hsv(0, 100%, 100%) | cmyk(0%, 100%, 100%, 0%) |
| white | #ffffff | rgb(255, 255, 255) | hsl(0, 0%, 100%) | hsv(0, 0%, 100%) | cmyk(0%, 0%, 0%, 0%) |
| black | #000000 | rgb(0, 0, 0) | hsl(0, 0%, 0%) | hsv(0, 0%, 0%) | cmyk(0%, 0%, 0%, 100%) |
| grey | #808080 | rgb(128, 128, 128) | hsl(0, 0%, 50%) | hsv(0, 0%, 50%) | cmyk(0%, 0%, 0%, 50%) |
| transparent | #00000000 | rgba(0, 0, 0, 0) | hsla(0, 0%, 0%, 0) | hsv(0, 0%, 0%) | cmyk(0%, 0%, 0%, 100%) |
How to convert a color
Enter a color
Type a HEX code with 3, 4, 6 or 8 digits, an rgb(), hsl() or hwb() value, or one of the 148 CSS color names. You can also click the color box and choose a color with your browser's picker.
Read the other models
The swatch shows the color over a checkerboard, so transparency is visible. The tiles show the same color as HEX, RGB, HSL, HSV and CMYK, and the nearest CSS color name.
Copy what you need
Press Copy on a tile to put that value on the clipboard, ready to paste into a stylesheet, a design tool or a document.
How the color models relate
RGB describes a color as the amounts of red, green and blue light a screen adds together, each from 0 to 255; #0060fd is 0 red, 96 green and 253 blue. HEX is the same three numbers written in base 16, so 96 is 60 and 253 is fd. HSL and HSV describe the same color as a hue angle from 0 to 360 degrees on the color wheel plus two percentages: saturation, and lightness (HSL) or value (HSV). #0060fd has hue 217 in both. CMYK describes ink: cyan, magenta, yellow and black are subtracted from white paper.
The CMYK shown here is the plain mathematical conversion: black is 1 minus the largest of R, G and B, and cyan, magenta and yellow are what remains. It is not a print profile, so a printer or a design program that uses ICC profiles will give different CMYK numbers for the same color. HSL values are shown as whole numbers, so converting a rounded value back can move a channel by a few units: hsl(217, 100%, 50%) is #0062ff, not #0060fd. The nearest CSS name is the keyword with the smallest CIE76 color difference in L*a*b* space. Everything runs in your browser and nothing is sent anywhere.
Color converter questions
How do I convert HEX to RGB?
Split the six digits into three pairs and read each pair as a base 16 number. #0060fd is 00, 60 and fd, which are 0, 96 and 253, so the color is rgb(0, 96, 253). Paste the HEX code into the field and the RGB tile shows the result.
What do the last two digits of an 8-digit HEX code mean?
They are the alpha channel, the opacity, from 00 (fully transparent) to ff (fully opaque). #0060fd80 is the same blue at 128 out of 255, which is about 50.2% opacity, so it is shown as rgba(0, 96, 253, 0.502). A 4-digit code such as #06f8 works the same way, with each digit doubled.
What is the difference between HSL and HSV?
Both use hue and saturation, but the third value differs. In HSL, lightness 50% is the pure color, 0% is black and 100% is white. In HSV, value 100% is the brightest version of the color, and white needs saturation 0%. The same blue is hsl(217, 100%, 50%) and hsv(217, 100%, 99%).
Can I use the CMYK result for printing?
Use it as a starting point only. This page uses the simple formula between RGB and CMYK, which knows nothing about inks, paper or a printer's profile. A print shop or a design program with a color profile will convert the same RGB color to different CMYK numbers.
Which color formats can I type?
HEX with or without the #, in 3, 4, 6 or 8 digits; rgb() and rgba() with commas or spaces, numbers or percentages, and an optional alpha after a slash; hsl(), hsla() and hwb() with an angle in deg, rad, grad or turn; the 148 CSS color names such as rebeccapurple; and transparent.
Why is the nearest color name not an exact match?
CSS has only 148 color names, so most colors have no name of their own. The page picks the name whose color looks closest, measured as the CIE76 color difference in L*a*b* space; for #0060fd that is mediumslateblue. When the color is exactly a named one, such as #ff0000, the page says it is an exact match.