Color Converter
Supports auto-detection and conversion between HEX, RGB, HSL, and CMYK, with a built-in color picker wheel, tints & shades, color schemes, and WCAG contrast checker. All processing is done locally in your browser — no data is uploaded to any server.
Color Picker
Tints & Shades
Color Schemes
History
Favorites
WCAG Contrast Checker
Select a background and foreground color to check WCAG accessibility compliance
What is a Color Converter?
A Color Converter is an online tool that helps developers freely convert between different color formats. The most commonly used color formats in web development include HEX (hexadecimal), RGB (Red-Green-Blue), HSL (Hue-Saturation-Lightness), and CMYK (Cyan-Magenta-Yellow-Key for print). This tool supports automatic input format detection and simultaneously outputs all four formats, greatly improving your color workflow efficiency.
Color Format Reference
- HEX — Hexadecimal color code, prefixed with
#, e.g.#ff6600. The most widely used color format in CSS. - RGB — Red, Green, Blue representation, e.g.
rgb(255, 102, 0). Each channel ranges from 0 to 255. - HSL — Hue (0-360°), Saturation (0-100%), Lightness (0-100%). The most intuitive color model for humans.
- CMYK — Cyan, Magenta, Yellow, Key (black). The standard format for the printing industry.
- CSS Named Colors — Over 140 color names defined by W3C, such as
rebeccapurpleandcoral.
Common Use Cases
- UI Design — Designers provide HEX values; developers need HSL to adjust lightness and darkness
- Button States — Use Tints & Shades to generate hover/active color scales
- Brand Colors — Generate complementary, triadic, and other color scheme combinations
- Accessibility Testing — Use the WCAG contrast checker to ensure text readability
- CSS Gradients — Save palettes to favorites for later gradient generation
WCAG Contrast Standards
- AA Standard — Normal text ≥ 4.5:1, large text ≥ 3:1
- AAA Standard — Normal text ≥ 7:1, large text ≥ 4.5:1