HEX, RGB, HSL color converter and contrast checker
Pick a color to get its HEX, RGB and HSL codes, then test how readable it is on a background. #0F766E is rgb(15, 118, 110) and hsl(175, 77%, 26%).
- Checked on thousands of cases
- Sources: W3C
- Updated November 6, 2026
HEX code
rgb(15, 118, 110) · hsl(175, 77%, 26%)
- Hue
- 175°
- Saturation
- 77 %
- Lightness
- 26 %
Contrast checker
Sample text
Sample text
Contrast ratio
- AA · body text ≥ 4.5:1Pass
- AA · large text ≥ 3:1Pass
- AAA · body text ≥ 7:1Fail
- AAA · large text ≥ 4.5:1Pass
- Interface components (AA) ≥ 3:1Pass
Quick challenge
Streak 0Best 0
Test yourself: every answer is computed by the tool, and the wrong choices are the most common traps.
How it works
Formula: Contrast = (L1 + 0.05) ÷ (L2 + 0.05)
A HEX code writes the red, green and blue components in hexadecimal, 0 to 255 each: #FF8000 = red 255, green 128, blue 0. HSL describes the same color by its hue (an angle on the color wheel), saturation and lightness. For contrast, each color's relative luminance is computed as defined in WCAG 2.2, then the ratio (L1 + 0.05) ÷ (L2 + 0.05), from 1:1 to 21:1. Body text needs 4.5:1 for level AA (7:1 for AAA), large text (18 pt, or 14 pt bold) 3:1 (4.5:1 for AAA), and interface components 3:1. The ratio is never rounded up: 4.49:1 does not pass.
Common colors and their contrast
| HEX code | RGB | HSL | On white | On black |
|---|---|---|---|---|
| #000000 | 0, 0, 0 | 0°, 0%, 0% | 21:1 | 1:1 |
| #FFFFFF | 255, 255, 255 | 0°, 0%, 100% | 1:1 | 21:1 |
| #FF0000 | 255, 0, 0 | 0°, 100%, 50% | 3.99:1 | 5.25:1 |
| #00FF00 | 0, 255, 0 | 120°, 100%, 50% | 1.37:1 | 15.3:1 |
| #0000FF | 0, 0, 255 | 240°, 100%, 50% | 8.59:1 | 2.44:1 |
| #FFFF00 | 255, 255, 0 | 60°, 100%, 50% | 1.07:1 | 19.55:1 |
| #00FFFF | 0, 255, 255 | 180°, 100%, 50% | 1.25:1 | 16.74:1 |
| #FF00FF | 255, 0, 255 | 300°, 100%, 50% | 3.13:1 | 6.69:1 |
| #808080 | 128, 128, 128 | 0°, 0%, 50% | 3.94:1 | 5.31:1 |
| #767676 | 118, 118, 118 | 0°, 0%, 46% | 4.54:1 | 4.62:1 |
| #0F766E | 15, 118, 110 | 175°, 77%, 26% | 5.47:1 | 3.83:1 |
Frequently asked questions
How do I convert HEX to RGB?
Split the code into three pairs and convert each from hexadecimal to decimal: #1E90FF gives 1E = 30, 90 = 144 and FF = 255, so rgb(30, 144, 255).
What contrast ratio does readable text need?
WCAG 2.2 asks for at least 4.5:1 for body text at level AA, and 7:1 at level AAA. Large text may go down to 3:1 at AA. On white, the gray #767676 just passes (4.54:1), while #777777 fails (4.47:1).
What is the difference between RGB and HSL?
They are two ways to write the same color. RGB mixes red, green and blue; HSL starts from a hue and sets saturation and lightness, which makes lighter or darker versions of a color easy to build.