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.

Closest CSS named color

mediumorchid

#ba55d3

Brightness: 50%(Dark color)

HEX

#a855f7

RGB

rgb(168, 85, 247)

HSL

hsl(271, 91%, 65%)

OKLCH

oklch(62.7% 0.2325 303.9)

On White (#fff)

3.96:1

AA Normal ✗ AA Large ✓ AAA Normal ✗ AAA Large ✗

Sample Text

On Black (#000)

5.31:1

AA Normal ✓ AA Large ✓ AAA Normal ✗ AAA Large ✓

Sample Text

Understanding Color Formats

HEX - The standard six-digit hexadecimal notation used in CSS and design tools (e.g., #a855f7).
RGB - Defines color using Red, Green, and Blue channels (0–255). Used in CSS and most programming languages.
HSL - Hue, Saturation, Lightness. More intuitive for adjusting colors - change lightness for shades/tints.
OKLCH - A perceptually uniform color space. Colors with the same lightness value in OKLCH actually appear equally bright, unlike HSL. Modern CSS supports it natively.

AA Normal (4.5:1) - Minimum contrast for body text to be readable by most users.
AA Large (3:1) - Minimum for large text (18px+ bold or 24px+ regular).
AAA Normal (7:1) - Enhanced contrast for maximum readability.
AAA Large (4.5:1) - Enhanced contrast for large text.

Need to test a specific color pair? Use our WCAG Contrast Checker for a detailed compliance report.

Color Converter & Palette Generator - Convert colors and generate complementary, analogous, and triadic palettes.
WCAG Contrast Checker - Test any two colors for WCAG AA and AAA compliance.
CSS Gradient Generator - Build gradients using your color and its shades/tints.
Color Palette Feature - Extract every color used on any live website with the MiroMiro extension.

MiroMiro's Chrome extension extracts complete color palettes from any live website - including HEX, RGB, HSL, and OKLCH values.