Design Tool
Color Converter
Convert HEX ↔ RGB, HSL, HSV, CMYK in real time. Harmonic palettes, WCAG contrast, CSS and Tailwind export.
HEX · RGB · HSL · HSV · CMYK
WCAG Contrast
CSS · Tailwind
Formats
HEX
RGB
RGBA
HSL
HSV
CMYK
CSS
HEX8
RGB Sliders
HSL Sliders
Alpha / Opacity
History
#7F00FF
WCAG Contrast
Aa
Aa
Harmonies
Gradient
Export CSS / Tailwind
CSS Variables + Tailwind
Color formats in CSS
HEX
6-digit (RRGGBB) or 8-digit (RRGGBBAA) hex format. Most widely used in CSS and design. E.g. #FF6600
HSL
Hue (0–360°), Saturation (0–100%), Lightness (0–100%). More intuitive for creating color variations. Native CSS3 format.
CMYK
Cyan, Magenta, Yellow, Black — subtractive model used in print. Not natively supported in CSS, but essential for print preparation.
WCAG
The WCAG 2.1 contrast ratio determines accessibility: AA requires 4.5:1 (normal text), AAA requires 7:1. Essential for web accessibility compliance.
FAQ
Split the hex code into 3 pairs (RR, GG, BB) and convert each pair from hexadecimal to decimal. E.g. #FF6600 → R=255 (FF), G=102 (66), B=0 (00). This tool does it automatically.
HSL (Lightness) defines white at L=100% and black at L=0%. HSV/HSB (Value) defines white at V=100%+S=0% and black at V=0%. HSL is preferred in CSS, HSV is used in design software like Photoshop.
WCAG (Web Content Accessibility Guidelines) defines minimum contrast levels between text and background. Level AA (minimum): 4.5:1 for normal text, 3:1 for large text. Level AAA (optimal): 7:1 for normal text.