Color Format Converter
Convert colors between HEX, RGB, RGBA, HSL, HSLA, HSV and CMYK online. Type a color value or pick one with the color picker, and every other format updates instantly with a live preview swatch.
FreeOnline Tool
Loading…
How to Use
- Enter a color value in the input box (HEX, RGB, HSL, HSV and other formats are accepted).
- The tool converts it into every other color format automatically and displays the results.
- You can also use the built-in color picker to choose a color directly.
- Click the copy button next to any format to copy the value you need.
Features
- Supports the mainstream color formats: HEX, RGB, RGBA, HSL, HSLA, HSV and CMYK
- Built-in color picker for choosing a color visually
- Converts in real time, refreshing every format as you type
- Shows a preview swatch of the current color
- Each format can be copied individually with one click
Use Cases
Keeping CSS color formats consistent
Designs often ship in HEX while a CSS variable system uses HSL, so convert between the two to keep colors identical across both.
Defining design system tokens
Convert a brand HEX color into RGB and HSL to produce the multi-format color variables a design system needs.
Supporting accessibility checks
Get exact RGB values to feed into a contrast calculator and verify that foreground and background meet WCAG requirements.
Preparing colors for print
Convert an on-screen RGB color to CMYK as a reference for print artwork, keeping in mind that the two gamuts differ.
FAQ
When should I use HEX, RGB or HSL?
HEX is the everyday choice in CSS and design tools, RGB suits code that manipulates channels, HSL matches how people think about hue, saturation and lightness so it works well for theming, and CMYK is for print.
Is a small difference after conversion normal?
Yes. Color space conversion involves floating-point math, so a round trip such as HSL to RGB and back can drift by around 1%. The visual difference is negligible.
How do I express transparency?
Alpha lives in the RGBA format, rgba(r,g,b,a), and the HSLA format, hsla(h,s%,l%,a), where a runs from 0 (fully transparent) to 1 (fully opaque). HEX can also carry alpha as 8 digits, #RRGGBBAA.
Do I have to type the # in a HEX color?
In CSS the # is required, as in #FF5500. In this tool the value is recognized correctly with or without it.