Color Converter
HEX from a mockup to RGB, or to CMYK for print. Type any format and get them all — plus tints, shades and contrast grades.
#hex, rgb(), hsl() or a color name (tomato)
This tool runs entirely in your browser. Nothing you add is uploaded to any server.
Last checked: · Made by Fingertip Workshop
How to use
- 1
Type any color —
#d4553a,rgb(212,85,58),tomato— or click the swatch to pick one. - 2
Every format appears below; copy with the button on the right.
- 3
Check tints, shades and contrast with white and black text.
Color formats
| Format | Example | Used in |
|---|---|---|
| HEX | #D4553A | Web, Figma, most design apps |
| RGB | rgb(212, 85, 58) | CSS, screen design, slides |
| HSL | hsl(11, 64%, 53%) | Adjusting lightness in CSS |
| CMYK | cmyk(0%, 60%, 73%, 17%) |
CMYK here is a formula-based approximation. Real print color depends on paper and press — check important jobs with your printer's profile.
Why contrast matters
Low contrast is hard to read for people with low vision or anyone in bright sunlight. WCAG 2.1 recommends at least 4.5:1 (AA) for body text and 3:1 for large text; 7:1 earns AAA.
FAQ
Is transparency supported?
Yes — enter rgba(0,0,0,0.5) or #00000080 to see RGBA.
Can I pick a color from a photo?
Use the image color picker, then paste the code here.
What about Pantone?
Pantone is proprietary, so we don't offer exact conversions. Use Pantone's own tools to find the nearest match.