Convert between HEX, RGB, HSL, and CMYK color formats
HEX, RGB, HSL, and CMYK describe the same color through different coordinate systems. HEX is compact (six hex digits encoding 24-bit RGB). RGB is the same values in decimal (0-255 per channel). HSL rearranges the axes into hue (0-360 degrees on the color wheel), saturation (0-100%), and lightness (0-100%), where lightness runs black -> pure color -> white, so 0% is black, 50% is the pure color, and 100% is white. CMYK is the subtractive, ink-based model used for print: cyan, magenta, yellow, and a black (key) channel, each 0-100%. Edit any one model in this tool and the other three update live, the conversions are fixed formulas, not lookups. Which format you choose depends on what you are doing. HEX is the web default because it is concise and copy-pasteable; browsers, design tools, and code all accept it without conversion. HSL is the format of choice when you need to generate tints and shades programmatically, because "the same color 10% lighter" maps directly to an HSL lightness tweak. CMYK is what print shops expect, since it models ink on paper rather than light on a screen. RGB is the format to use when you are interpolating colors in animations or gradients, because RGB math matches what GPUs do natively.
Initializing in your browser…
Convert between Unix/Epoch timestamps and human-readable dates. Supports seconds and milliseconds with timezone information
Extract dominant, vibrant, or muted colors from images. Generate color schemes with HEX, RGB, HSL values and export palettes for design projects.
Convert audio files between WAV, MP3, OGG, AAC, M4A, FLAC formats online. Adjust bitrate and quality settings. Free browser-based conversion with no file uploads to servers.
A brand asset gives you only #FF5733 but your CSS uses HSL for theming and a print spec needs CMYK.
Input
#FF5733
Every model
RGB: rgb(255, 87, 51) HSL: hsl(11, 100%, 60%) CMYK: 0%, 66%, 80%, 0%
The same colour is expressed in each model you might need: RGB for screens, HSL for building tints by nudging only lightness, and CMYK for print. Converting to CMYK is lossy (screen gamut is wider than ink), which is exactly why seeing the numeric drift here matters before sending artwork to a printer.
HEX, RGB, HSL, and CMYK describe the same color through different coordinate systems. HEX is compact (six hex digits encoding 24-bit RGB). RGB is the same values in decimal (0-255 per channel). HSL rearranges the axes into hue (0-360 degrees on the color wheel), saturation (0-100%), and lightness (0-100%), where lightness runs black -> pure color -> white, so 0% is black, 50% is the pure color, and 100% is white. CMYK is the subtractive, ink-based model used for print: cyan, magenta, yellow, and a black (key) channel, each 0-100%. Edit any one model in this tool and the other three update live, the conversions are fixed formulas, not lookups. Which format you choose depends on what you are doing. HEX is the web default because it is concise and copy-pasteable; browsers, design tools, and code all accept it without conversion. HSL is the format of choice when you need to generate tints and shades programmatically, because "the same color 10% lighter" maps directly to an HSL lightness tweak. CMYK is what print shops expect, since it models ink on paper rather than light on a screen. RGB is the format to use when you are interpolating colors in animations or gradients, because RGB math matches what GPUs do natively.
Beyond plain conversion, this tool has four modes. Convert mode shows HEX, RGB, HSL, and CMYK side by side with one-click copy for each, and uses the browser EyeDropper API (where available) to sample any pixel on screen, plus a nearest-named-color readout and a recent-colors history saved locally. Contrast mode computes the WCAG relative-luminance contrast ratio between your color and a chosen background and reports pass/fail for AA and AAA at both normal and large text sizes, the same math accessibility audits use. Harmony mode derives complementary, analogous, triadic, tetradic, and split-complementary palettes by rotating the hue on the color wheel. Blindness mode simulates how the color appears under protanopia, deuteranopia, tritanopia, and achromatopsia.
A detail worth knowing: HEX, RGB, and HSL all live in sRGB, while CMYK here is computed with the standard naive formula (k = min of the inverted channels, then the remaining channels normalized against it). That arithmetic CMYK is a useful approximation for picking ink values, but true print color depends on an ICC profile for the specific press and paper, so treat the CMYK output as a starting point rather than a press-accurate spec. For RGB-family colors, remember that gamma encoding means a numerical mid-value like RGB(128, 128, 128) is perceptually darker than the true midpoint between black and white, which is why naive RGB interpolation between two hues can pass through a muddy middle.
HSL is an additive, screen-oriented model with hue, saturation, and lightness, where lightness runs from black (0%) through the pure color (50%) to white (100%). CMYK is a subtractive, ink-oriented model (cyan, magenta, yellow, key/black) used for print. This tool converts between both.
It uses the standard arithmetic CMYK formula, which is a good approximation for picking ink values. True press-accurate CMYK depends on an ICC profile for the specific printer and paper, so use this output as a starting point.
Yes. Switch to Contrast mode, set a background color, and the tool shows the WCAG contrast ratio plus pass/fail for AA and AAA at normal and large text sizes.
The input expects full six-digit HEX (for example #000000). Three-digit shorthand like #000 is not expanded automatically, so enter the full form.
Conversions run on your device in JavaScript. The values you enter are never sent over the network.