Color Converter
Convert colors between HEX, RGB, HSL, HSV/HSB, and CMYK formats. HEX to RGB: split 6 hex digits into 3 pairs and convert to decimal (e.g. #3B82F6 → rgb(59, 130, 246)). RGB to HEX: convert each 0-255 value to 2-digit hex. HSL uses hue angle (0-360°), saturation, and lightness percentages. CMYK is for print with cyan, magenta, yellow, and black channels.
Convert colors between HEX, RGB, HSL, HSV/HSB, and CMYK formats instantly. Auto-detect any color format, see all conversions at once, search CSS named colors, and view complementary colors. Includes Material Design and Tailwind CSS color presets.
Enter Any Color
Accepts HEX, RGB, HSL, HSV/HSB, CMYK, or CSS color names
Preview
Complementary
#c47d09All Formats
HEX
#3B82F6RGB
rgb(59, 130, 246)HSL
hsl(217, 91%, 60%)HSV/HSB
hsv(217, 76%, 96%)CMYK
cmyk(76%, 47%, 0%, 4%)RGB Channels
R: 59G: 130B: 246
HSL Values
H: 217°S: 91%L: 60%
CSS Named Colors
Popular Presets
Color Format Guide
- HEX: 6-digit hexadecimal (#RRGGBB), e.g. #3B82F6
- RGB: Red, Green, Blue (0–255 each), e.g. rgb(59, 130, 246)
- HSL: Hue (0–360°), Saturation (0–100%), Lightness (0–100%)
- HSV/HSB: Hue (0–360°), Saturation (0–100%), Value/Brightness (0–100%)
- CMYK: Cyan, Magenta, Yellow, Key/Black (0–100% each) — used for print
How to Use
- Enter your value in the input field
- Click the Calculate/Convert button
- Copy the result to your clipboard
Frequently Asked Questions
- How do I convert HEX to RGB?
- To convert HEX to RGB, split the 6-digit hex code into three pairs representing Red, Green, and Blue, then convert each pair from hexadecimal to decimal. For example, #3B82F6: 3B = 59 (Red), 82 = 130 (Green), F6 = 246 (Blue), giving rgb(59, 130, 246). Our converter does this automatically for any hex color.
- What is the difference between RGB and CMYK?
- RGB (Red, Green, Blue) is an additive color model used for screens — combining all three at full intensity produces white. CMYK (Cyan, Magenta, Yellow, Key/Black) is a subtractive model used for print — mixing all inks produces black. Colors may look different on screen vs. print because the color gamuts differ. Always convert to CMYK before sending designs to a printer.
- What is HSL and how does it differ from HSV/HSB?
- HSL (Hue, Saturation, Lightness) and HSV/HSB (Hue, Saturation, Value/Brightness) both describe color using a hue angle (0–360°) and two percentages. The key difference: in HSL, 100% lightness is always white, while in HSV, 100% value is the purest form of the hue. HSL is often preferred in CSS because its lightness scale is more intuitive — 50% lightness gives the "pure" color.
- Can I use CSS color names instead of hex codes?
- Yes! CSS supports 148 named colors like "coral" (#FF7F50), "tomato" (#FF6347), and "steelblue" (#4682B4). Named colors are valid in CSS properties just like hex or rgb() values. They are great for prototyping but hex/rgb gives you access to all 16.7 million colors. Our converter includes a searchable CSS named color list.
- What is a complementary color?
- A complementary color sits directly opposite another on the color wheel (180° apart in hue). For example, the complement of blue (#0000FF) is yellow (#FFFF00). Complementary pairs create high contrast and visual energy when used together, making them popular in design for call-to-action buttons, alerts, and branding. Our converter shows the complementary color automatically.
- How do I convert RGB to HEX manually?
- Convert each RGB value (0–255) to a two-digit hexadecimal number. For rgb(59, 130, 246): 59 in hex = 3B, 130 in hex = 82, 246 in hex = F6, giving #3B82F6. Values under 16 need a leading zero (e.g., 10 = 0A). Combine all three pairs with a # prefix.