Color Converter
Convert colors between HEX, RGB, HSL, and CMYK formats. Includes a visual color picker, Tailwind CSS class lookup, palette generator, and WCAG contrast ratio checker.
84%, 58%, 0%, 8%blue-600#2563ebclose match#2563eb#ffffffHow to Use the Color Converter
Pick a color using the visual color picker or enter values directly in any format — HEX, RGB, HSL, or CMYK. All other formats update instantly. Use the WCAG contrast checker to verify that your foreground and background colors meet accessibility standards. Click any palette swatch to explore analogous colors. Pair your colors with our CSS gradient generator to create beautiful backgrounds.
What Are Color Formats?
HEX codes like #2563eb represent colors using hexadecimal red, green, and blue values — the most common format in CSS. RGB uses decimal values from 0 to 255 for each channel. HSL (Hue, Saturation, Lightness) is more intuitive for human editing because you can adjust brightness or saturation independently. CMYK (Cyan, Magenta, Yellow, Key/Black) is used in print design. Understanding all four formats helps designers and developers work across web, print, and design tools.
Common Use Cases
Convert a designer's HEX color to RGB for CSS. Check if your text color passes WCAG AA contrast requirements (4.5:1 ratio for normal text). Generate an analogous color palette from a brand color. Convert web colors to CMYK for print materials. Need to convert hex color codes from number base systems? Try the Number Base Converter for hex-to-decimal math. Use the CSS unit converter to size elements alongside your color values.