Design Tools
HEX to RGB Converter
Convert between HEX, RGB, and HSL with live color preview and WCAG contrast ratios.
All formats
WCAG contrast ratios
On white background
AA Large ✓
3.68:1
On black background
AA ✓
5.71:1
Sample text
Sample text
More than just a converter
We also show HSL (often easier for designers), WCAG 2.1 contrast ratios against both white and black, and a live swatch so you can verify the color before committing it to your design system or CSS file.
Frequently Asked Questions
What is HEX color notation?▾
HEX is a base-16 representation of RGB color values. #RRGGBB where each pair is 0-255 in hex (00-FF). #FF0000 = pure red. The 3-digit shorthand (#F00) doubles each character (#FF0000).
How do I convert HEX to RGB by hand?▾
Split the HEX code into 3 pairs (RR, GG, BB) and convert each pair from hex to decimal. #6B8E23 → 6B=107, 8E=142, 23=35 → rgb(107, 142, 35). The opposite direction works the same in reverse.
What is HSL?▾
HSL = Hue (0-360°), Saturation (0-100%), Lightness (0-100%). Often more intuitive than RGB for designing — adjust lightness to make a color brighter or darker without changing its identity. CSS supports HSL natively.
What is WCAG contrast ratio?▾
Contrast ratio measures the brightness difference between two colors. WCAG 2.1 requires 4.5:1 minimum for normal text (AA) and 7:1 for AAA. We show ratios against both white and black so you can pick a readable text color.
How does the live preview work?▾
As you type any valid HEX or RGB, we update the swatch instantly so you can verify the color is what you expect. Click "Random" to explore.