HEX, RGB, HSL, and CMYK Color Formats Explained

HEX is compact RGB notation

A six-digit HEX color stores red, green, and blue channel values in hexadecimal notation. For example, the first pair controls red, the second green, and the third blue. It is popular in CSS because it is compact, familiar, and easy to copy.

Short three-digit HEX values are expanded by repeating each digit. Alpha transparency may also be represented with additional digits, although teams should document this clearly because eight-digit values are harder to read at a glance.

RGB describes emitted light

RGB combines red, green, and blue light. Digital displays create colors by emitting these channels at different intensities. Values are often written from 0 to 255, though software may use percentages or normalized decimals.

RGB is additive: increasing channels moves toward white. That behavior differs from ink on paper, which absorbs light rather than emitting it.

HSL is useful for systematic adjustment

HSL represents hue, saturation, and lightness. Designers often find it easier to create related variations by keeping a hue and changing saturation or lightness. It can be useful for generating hover states, backgrounds, or a first draft of a tonal scale.

Equal lightness values do not guarantee equal perceived brightness across hues. A yellow and a blue with the same HSL lightness can feel very different, so contrast still needs to be measured rather than assumed.

CMYK belongs to print production

CMYK combines cyan, magenta, yellow, and black inks in a subtractive process. The printable range depends on the printer, ink, paper, and color profile. Some intense screen colors cannot be reproduced exactly in standard CMYK printing.

Do not rely on a casual numeric conversion for critical print work. Use the printer’s requested profile, review a soft proof, and order a physical proof when brand accuracy matters.

Choose the format for the destination

Use HEX, RGB, or HSL in CSS and digital design systems according to team preference and browser needs. Use print-ready values and profiles supplied by a production workflow for printed material. Keep a master color specification that records approved screen and print equivalents.

Conversions are interpretations between color spaces, not guarantees of identical appearance. Screen calibration, ambient light, paper, and ink all affect the final result.

Where newer CSS color formats fit

Modern CSS is not limited to HEX, RGB, and HSL. The CSS Color specification also defines formats including HWB, Lab, LCH, Oklab, and OKLCH. They describe color in different coordinate systems and can make some workflows—especially perceptual adjustments and wide-gamut color—more expressive. Support and gamut still matter, so production code may need fallbacks depending on your browser targets.

Do not confuse notation with gamut

A syntax is not automatically a larger color space. A HEX value and an rgb() value normally describe the same sRGB space in different notation. Conversely, CSS can express colors outside sRGB with functions and color spaces designed for that purpose. Use the Color Converter when you need equivalent representations, and verify whether the destination can display the intended gamut.