Color Info & Lookup - HEX, RGB, HSL, OKLCH
Enter any hex color code to get detailed conversions (RGB, HSL, OKLCH), WCAG contrast ratios, shades, tints, and the closest CSS named color.
mediumorchid
#a855f7
WCAG Contrast Ratios
On White
3.96:1
On Black
5.31:1
Shades & Tints
Shades (Darker)
Tints (Lighter)
Related Colors
Complementary
Analogous
Understanding Color Formats
- HEX
- - Standard six-digit hex notation for CSS and design tools.
- RGB
- - Red, Green, Blue channels (0-255). Universal across CSS and code.
- HSL
- - Hue, Saturation, Lightness. Intuitive for creating shades and tints.
- OKLCH
- - Perceptually uniform. Same lightness = same perceived brightness. Modern CSS native.
WCAG Contrast Levels
- AA Normal (4.5:1)
- - Minimum for body text readability.
- AA Large (3:1)
- - Minimum for large text (18px+ bold / 24px+).
- AAA Normal (7:1)
- - Enhanced contrast for maximum readability.
- AAA Large (4.5:1)
- - Enhanced contrast for large text.
Frequently Asked Questions
What color formats does this tool support?
This tool converts any color to HEX, RGB, HSL, and OKLCH formats simultaneously. Enter a hex code and get all four formats instantly with one-click copy.
What is OKLCH and why should I use it?
OKLCH is a perceptually uniform color space where colors with the same lightness value actually appear equally bright, unlike HSL. Modern CSS supports it natively, making it ideal for design systems and consistent UI palettes.
How are shades and tints calculated?
Shades are generated by decreasing the lightness value in HSL, producing darker versions. Tints increase the lightness, producing lighter versions. Both maintain the original hue and saturation for consistent palettes.