How is contrast ratio different from luminance?

Contrast ratio compares two colors, usually text and background, against WCAG thresholds. Luminance is the relative brightness of a single color. Check both when you need readable text.

When should I use OKLCH instead of HSL?

OKLCH is a perceptual space, so equal lightness steps look more even than in HSL. Use it for design-system ramps and modern CSS. HSL still helps when you need a quick hue shift or older browser support.

Do these color tools upload what I pick?

No. Conversion, contrast, palettes, grayscale, and OKLCH previews all run locally in your browser.

Color Tools - Contrast, Palette & OKLCH

Tool Topics

Color Tools - Contrast, Palette & OKLCH

Pick, convert, and check colors in the browser. Move between hex, RGB, and HSL, build a palette, measure contrast and luminance, preview grayscale, and explore OKLCH. Useful for CSS, design systems, and accessibility reviews. Processing stays on your device.

Featured Tools

Color Convert

Convert between RGB, HSL, and CMYK

Color Tools - Contrast, Palette & OKLCH

Featured Tools

Color Convert

Color Contrast Ratio Calculator

Color Palette

All Tools15

Color Luminance Calculator

Color Grayscale Calculator

OKLCH Explorer

CSS Color Names

CSS Gradient Generator

Color Harmony Generator

Color Mixer

Color Blindness Simulator

Tailwind Color Finder

Random Color Generator

Image Color Extractor

Image to CSS Gradient

Frequently Asked Questions

Explore Other Topics

Tool Topics

All Tools
15