Skip to content
Free design tool

Color converter

Paste a color in any common CSS format and see it written in all the others. Web designers and developers use it to move colors between design files, stylesheets and code.

  • Runs in your browser
  • Free, no account needed
  • Copy or download the result
Private: runs on this device

Input

7 characters

Result

HEX: #ff6347
RGB: rgb(255, 99, 71)
HSL: hsl(9.1, 100%, 63.9%)
HWB: hwb(9.1 27.8% 0%)
CMYK (approximate, simple formula without a print profile): cmyk(0%, 61.2%, 72.2%, 0%)
Nearest named color: tomato, exact match

Example

Input
#ff6347
Result
HEX: #ff6347
RGB: rgb(255, 99, 71)
HSL: hsl(9.1, 100%, 63.9%)
HWB: hwb(9.1 27.8% 0%)
CMYK (approximate, simple formula without a print profile): cmyk(0%, 61.2%, 72.2%, 0%)
Nearest named color: tomato, exact match

How to use the color converter

  1. Type a color in the box, such as #ff6347, rgb(255 99 71), hsl(9 100% 64%) or tomato.
  2. Press Run to see HEX, RGB, HSL, HWB, CMYK and the nearest named color.
  3. Press Copy result or Download to keep the values.
  4. Press Use example to load #ff6347, or Reset to start over.

How it works

Hex colors can have 3, 4, 6 or 8 digits, with or without the # sign. rgb(), rgba(), hsl(), hsla() and hwb() accept both the comma style and the newer space style with a slash before alpha.

Hues can use deg, rad, grad or turn units. All 148 CSS named colors are recognized, plus transparent.

CMYK uses the simple formula K = 1 minus the largest RGB channel, so it is only an approximation of what a printer would use.

The nearest named color is the one with the smallest CIE76 Delta E distance in Lab color space. Out of range values such as rgb(300, 0, 0) and the none keyword are rejected.

Everything runs in your browser. Your input is not uploaded or stored.

Questions and answers

How do I convert HEX to RGB?

Split the six hex digits into three pairs and read each pair as a number from 0 to 255. For #ff6347 that gives rgb(255, 99, 71). This tool does it for you and adds HSL, HWB and CMYK.

Is the CMYK value exact?

No. It uses a simple formula without a print color profile, so treat it as a starting point. Design apps that use print profiles will give different numbers.

Does it support transparency?

Yes. 4 and 8 digit hex, rgba(), hsla() and the slash alpha syntax are read, and the alpha value is kept in the HEX, RGB, HSL and HWB results.

What is HWB?

HWB stands for hue, whiteness and blackness. It describes a color as a pure hue mixed with white and black, and modern browsers support it in CSS.

All 220 SnowRock tools