Universal Color Converter
Convert between HEX, RGB, HSL, HSV, CMYK, and HWB instantly, in your browser.
Why use it
Every color model in one converter
6 color models
HEX, RGB, HSL, HSV, CMYK, and HWB. Convert between any combination in a single step.
Private
Conversion happens entirely in your browser. No color value ever leaves your device.
Full precision
Exact results following ICC specs, W3C CSS Color Level 4, and sRGB standards.
Instant
Real-time conversion as you type. No buttons, no waiting.
How it works
Three steps, no hassle
Enter the source color
Type or paste the color value in any format: #FF5733, rgb(255,87,51), hsl(11,100%,60%), cmyk(0%,66%,80%,0%), or hwb(11 0% 0%). You can also use any of the 140 CSS named colors like 'tomato' or 'steelblue'.
Select the target format
Choose the color model to convert to: HEX for web, RGB for screens, HSL for modern CSS, HSV/HSB for design tools, CMYK for print, or HWB for the CSS Color Level 4 standard.
Copy the result
Get the exact color value in the chosen format with one click. The converter also shows a live color preview and all values across every model simultaneously.
FAQ
Got questions?
A color model is a mathematical representation that describes colors systematically using numerical coordinates. Each model approaches color from a different perspective: RGB describes it as a mixture of light (red, green, blue); CMYK as a mixture of inks (cyan, magenta, yellow, black); HSL and HSV describe it in human-perceptual terms (hue, saturation, lightness/value); HWB (CSS Color Level 4) uses hue, whiteness amount, and blackness amount. There is no 'best' model: the choice depends on the use context (screen, print, code editing, design tools).
RGB (Red, Green, Blue) is an additive color model: mixing all three at maximum produces white. It is used for screens, monitors, LEDs, and any light-emitting device. CMYK (Cyan, Magenta, Yellow, Key/Black) is a subtractive model: mixing the three base colors theoretically produces black (in practice a muddy dark brown, which is why a pure black K channel is added). CMYK is used in printing. Converting between RGB and CMYK is never perfect because they have different color gamuts: vibrant screen colors (electric blues, fluorescent greens) cannot be reproduced in standard offset printing.
HSL (Hue, Saturation, Lightness) is more intuitive for humans than RGB because it separates a color's hue from its saturation and lightness. To darken a blue in RGB you must recalculate all three channels; in HSL you simply reduce the L value. For creating brand variants (light, dark, saturated, desaturated), HSL makes transformations predictable. In modern CSS, HSL enables dynamic theming with variables: --color-brand: hsl(220, 90%, 50%); and creating variants by adjusting only L or S.
HWB (Hue, Whiteness, Blackness) is a color model defined in the CSS Color Level 4 specification (W3C), designed to be even more intuitive than HSL. Instead of saturation and lightness, it uses directly how much white (W) and how much black (B) are mixed with the pure hue. hwb(0, 0%, 0%) is pure red; hwb(0, 50%, 0%) is pink; hwb(0, 0%, 50%) is dark red; hwb(0, 50%, 50%) is grey. All modern browsers have supported hwb() since 2022. It is useful when you need to manipulate colors in a visually predictable way without complex calculations.
Color gamut is the range of colors a device or color space can represent. sRGB (the screen standard since 1996) covers approximately 35% of the CIE 1931 space visible to the human eye. Display P3 (used in iPhone and Mac since 2016) covers about 26% more than sRGB. Rec.2020 (HDR) covers nearly double sRGB. When converting between HEX/RGB/HSL you are within the sRGB space: all values are representable. Converting to CMYK, the printable gamut differs (some vibrant reds are not reproducible in offset; some bright cyans in print are not reproducible on screen). CMYK → RGB conversion can produce colors that look different from the printed original.
Color models: history from Newton to CSS Color Level 4
Modern color theory begins with Isaac Newton in 1672, when he published his prism experiments in the Philosophical Transactions of the Royal Society. Newton demonstrated that white light is the sum of all visible spectrum colors and proposed the first chromatic circle with 7 colors (red, orange, yellow, green, blue, indigo, violet), a number chosen by analogy with musical notes. In 1810, Johann Wolfgang von Goethe published his Theory of Colors, arguing that color was an interaction between light and darkness, and created the first 6-color circle with opposing complementaries. Although his scientific conclusions were incorrect (refuted by Helmholtz), his circular model influenced the color wheels used in design to this day.
The CIE 1931 chromaticity diagram was the first attempt to mathematically define all colors perceivable by the average human eye. The Commission Internationale de l'Eclairage (CIE) created in 1931 the XYZ color space based on color-matching experiments by Wright (1928) and Guild (1931), where human participants adjusted mixtures of three primary lights to match reference colors. The CIE XYZ space contains all visible colors and serves as the absolute reference space for converting between any relative color space (sRGB, Adobe RGB, Display P3). The sRGB standard (IEC 61966-2-1) was defined in 1996 by HP and Microsoft and became the universal standard for screens and the web, with a D65 white point (6500K) and an approximately 2.2 gamma curve.
CSS Color Level 4, developed by the W3C CSS Working Group, expands available CSS colors beyond sRGB. It introduces the display-p3, rec2020, a98-rgb, prophoto-rgb, oklch, and oklab color spaces using the color() function. The oklch space (proposed by Björn Ottosson in 2020 as an improvement over LCH from the CIELAB space) is especially valued in design because it has more uniform lightness perception than HSL: two colors with the same L value in oklch appear equally bright to the human eye, which does not hold true in HSL. Browsers have supported oklch since 2023. Color management in browsers uses ICC profiles embedded in images to automatically convert between color spaces and ensure reproducibility across devices.