Color Converter

Convert a color between hex, RGB, HSL, HWB, CMYK, and NCol formats.

Supports 148 HTML color names plus all common color-code formats in either direction.

Updated August 13, 2026

CreatorFrank Zhao

Loading calculator…

Introduction / overview

The Color Converter translates any color into seven common formats at once — HTML color names, RGB, hexadecimal, HSL, HWB, CMYK, and Natural Colors (NCol). You choose the format you already have, type it in, and every other representation is recalculated automatically below it.

Conversions run both ways: start from a hex code, an RGB triplet, a hue-based value, or even a color name, and the tool works back to the same underlying color and back out to the other five formats.

It is the tool to reach for whenever you have a color in one format and need it in another — a web designer grabbing the hex or RGB values behind a design, a developer turning a hex code into HSL for a CSS rule, or a print designer converting an on-screen color into CMYK ink percentages. Because all seven representations appear side by side, it is also a quick way to see what a color actually consists of: how much red and blue it has, what hue it sits at, and how much black ink it would need.

How to use / quick start

Choose the format you have

Open Input format and pick one of Name, RGB, Hexadecimal, HSL, HWB, CMYK, or Natural Colors (NCol). The chosen format moves to the top and becomes editable.

Enter the color

RGB channels take whole numbers from 0 to 255, hue takes degrees from 0 to 360, and the percentage fields (saturation, lightness, and the CMYK inks) take values from 0 to 100%. Hex codes accept #ff6347, ff6347, or the 3-digit short form #f63.

Read the six derived representations

The format you chose stays editable; every other representation below it is a read-only result that updates instantly as you type. Select the text you need to copy it straight into your code or document.

Example — convert tomato to every format

Switch to Hexadecimal and type $\#ff6347$ (or switch to RGB and type 255, 99, 71). The tool fills in all of the rest:

\mathrm{RGB}(255,\ 99,\ 71)

\ \Rightarrow\

\mathrm{HSL}(9^\circ,\ 100\%,\ 64\%)

\mathrm{HWB}(9^\circ,\ 28\%,\ 0\%)

\mathrm{CMYK}(0\%,\ 61\%,\ 72\%,\ 0\%)

\ \Rightarrow\

\mathrm{NCol}\ \mathrm{R15},\ 28\%,\ 0\%

\ \Rightarrow\

\text{name: } \mathrm{Tomato}

Because the color is an exact match for one of the standard CSS names, the Name field reads Tomato too. Try entering the same color from another angle — say HSL 9, 100, 64 or the name Tomato — and you will land on the same $\#ff6347$ .

Calculation method

Every conversion in this tool passes through RGB. That is convenient because all of the other formats are defined in terms of the same red, green, and blue intensities on a $0\text{–}255$ scale — the same triplet sits behind a hex code, an HSL value, an HWB value, and a color name.

RGB to HSL

\Delta = \max(R,G,B) - \min(R,G,B)

L = \frac{\max + \min}{2}

S = \frac{\Delta}{1 - |2L - 1|}

Hue depends on which channel is largest; for red it is $H = 60^\circ \cdot \frac{G - B}{\Delta} \bmod 360$ , with similar forms for green and blue. R, G, and B are normalized to $0\text{–}1$ first. Hue comes out in degrees, and saturation and lightness come out as fractions that are displayed as percentages.

RGB to CMYK

K = 1 - \max(R', G', B')

C = \frac{1 - R' - K}{1 - K}

M = \frac{1 - G' - K}{1 - K}

Y = \frac{1 - B' - K}{1 - K}

CMYK is the subtractive model used for printing. Key (black) is whatever the brightest channel leaves over, and the other three inks are derived from it. For a pure black color the $1 - K$ denominator would be zero, so the tool simply sets cyan, magenta, and yellow to $0$ .

RGB to hex

\# = \mathrm{R}_{16}\ \mathrm{G}_{16}\ \mathrm{B}_{16}

Each $0\text{–}255$ channel is written as two hex digits, so $255$ becomes $ff$ and RGB(255, 0, 0) becomes $\#ff0000$ . The 3-digit short form (like $\#f00$ ) simply duplicates each digit and is expanded automatically.

RGB to HWB and NCol

W = \min(R', G', B')

B = 1 - \max(R', G', B')

H = \text{same hue as HSL}

HWB describes a color as a hue plus how much white and black are mixed in. NCol uses the same idea but writes the hue as a letter — R, Y, G, C, B, or M — followed by a percentage towards the next hue, so a hue near $9^\circ$ reads as $\mathrm{R15}$ .

Variables

$R,\ G,\ B$ — red, green, and blue channels (0–255)
$H$ — hue in degrees (0–360)
$S,\ L$ — saturation and lightness (0–100%)
$C,\ M,\ Y,\ K$ — cyan, magenta, yellow, and key ink (0–100%)
$W,\ B$ — whiteness and blackness in HWB / NCol (0–100%)

All of these conversions also run in reverse: because every format is defined from RGB, the tool can start from any of the seven, recover the RGB triplet, and then produce the other five. Hue and the percentage channels are rounded to whole numbers for a clean readout, but the underlying calculation keeps more precision so the derived values stay consistent.

Which format should I use?

All seven formats describe the same color, but each one was built for a different workflow. Knowing which to reach for saves you from round-tripping through several tools.

Hex and RGB for screens

Hex codes are the standard way to write colors in CSS and HTML, and RGB spells out the same sRGB model channel by channel. If you are styling a web page or reading a value out of a design tool, these are almost always what you will see — the CSS Color Module Level 4 defines hex, rgb(), hsl(), hwb(), and the named colors all in the same sRGB color space.

CMYK for print

Printers mix cyan, magenta, yellow, and black ink subtractively, so an on-screen color has to be converted to CMYK before it goes to a press. The conversion here uses the standard simplified model; the exact result on paper still depends on your ink, paper, and printer profile.

HSL and HWB for adjusting colors

Lightness, saturation, and hue are far more intuitive than three raw channels. If you want “the same hue, a little lighter”, you change $L$ in HSL or add whiteness in HWB instead of guessing at RGB numbers. Many color pickers are built around HWB for exactly this reason.

Natural Colors for describing colors

NCol names a hue by letter and percentage — $\mathrm{R15}$ instead of $9^\circ$ — and pairs it with whiteness and blackness. It is a readable shorthand when you are talking about a color out loud or jotting it down in notes.

Why conversions are slightly lossy

RGB and CMYK do not cover exactly the same range of colors: screens emit light and can show very saturated colors that a mix of four inks cannot reproduce exactly. The CMYK values you get are the best standard-model match, not a guarantee that the printed result will look identical. The tool also rounds RGB channels, hue, and the displayed percentages to whole numbers, so converting away and back can land a step or two from the original — normal for any color converter.

Frequently asked questions

Why does my color show “no name”?

The tool recognizes the 148 standard CSS color names, from AliceBlue to YellowGreen. Most of the roughly 16.7 million possible colors do not have one, so when you enter a color outside that list the Name field shows no name — it is not an error, just a sign that no standard keyword exists for that exact color.

Can I print exactly what I see on screen using the CMYK values?

Not necessarily. The CMYK numbers are the standard mathematical conversion, but the printed result depends on the ink, paper, and the printer’s color profile. Screens can also display colors outside what CMYK ink can reproduce, so very saturated on-screen colors may come out flatter in print. For color-critical work, judge from a proof or a print test rather than the numbers alone.

Why are the HSL, HWB, and CMYK values whole numbers?

Saturation, lightness, and the ink percentages are rounded to whole percents for a clean readout, and hue is shown to the nearest degree. The underlying calculation keeps more precision, so all of the derived representations stay consistent with the color you entered.

Limitations

This calculator works with the standard sRGB color model. RGB channels must be whole numbers from 0 to 255, hue from 0 to 360, and percentage fields from 0 to 100. Hex codes must be three or six digits with or without a leading $\#$ — the 4- and 8-digit forms that add transparency are not supported here. Only colors that exactly match one of the 148 standard CSS names get a name; everything else shows no name. The RGB-to-CMYK conversion is a simplified standard model, so the printed color may differ from the screen.

Related Calculators

Scale Calculator

Calculate scale factors and convert scaled or real dimensions for length, area, and volume.

Try Now

Text to NATO alphabet

Transform text into the NATO phonetic alphabet for oral transmission. Convert letters A–Z into Alpha/Bravo/Charlie… and copy instantly.

Try Now

Text to ASCII binary

Convert text to ASCII (8-bit) binary and convert ASCII binary back to text. Clean input automatically and copy results instantly.

Try Now

Text to Unicode

Convert text to Unicode decimal HTML entities (e.g., A) and convert them back to text. Runs locally in your browser with one-click copy.

Try Now

Escape/unescape HTML entities

Escape and unescape HTML entities for <, >, &, ", and ’. Runs locally in your browser with instant copy.

Try Now

Integer Base Converter

Convert an integer between bases 2–64 (binary, octal, decimal, hexadecimal, base64, and custom). Runs locally in your browser.

Try Now