Digital Color Tester
Preview RGB, HEX and HSL values, complementary colors and foreground/background contrast.
How to use this test
Choose a color or enter HEX, RGB or HSL values. Edit any channel and use the preview, complementary color and contrast results to compare white and black text readability.
How the measurement works
The tool converts between HEX, RGB and HSL locally and calculates WCAG-style contrast ratios from relative luminance for black and white text previews.
How to interpret results
Higher contrast ratios are easier to read. The page labels 4.5:1 as AA and 7:1 as AAA for normal text comparisons, while actual accessibility requirements also depend on text size and context.
Troubleshooting tips
Enter a complete six-digit HEX value or use the numeric fields. If the displayed color differs from another device, compare monitor profiles, brightness and browser color management.
Related tests
You can also browse every utility from the complete tool index.
Common color questions
What is the difference between HEX, RGB and HSL?
HEX and RGB describe digital color using red, green and blue channel values, while HSL describes hue, saturation and lightness. They can represent the same color through different notation systems.
Read full answer →How do I check if text color has enough contrast?
Compare foreground and background colors using a WCAG contrast calculation. The tool can give quick AA/AAA references, but final accessibility also depends on text size, weight and actual interface context.
Read full answer →Why does the same HEX color look different on another screen?
Digital values can be identical while displays differ in gamut, calibration, brightness and color management. The numeric color is the same even if the physical appearance is not.
Read full answer →Can I edit HEX, RGB and HSL values?
Yes. The fields stay synchronized locally, so changing one color model updates the preview and the other representations.
Read full answer →