Color Converter

Convert colors between HEX, RGB, RGBA, HSL, HSV, and OKLCH. Audit WCAG contrast ratios and export design systems.

Color Select & Values

White TextBlack Text
Select from Canvas

WCAG Contrast Auditor

4.5:1
White Text Ratio
Pass AA
4.5:1
Black Text Ratio
Pass AAA

Design Palette Generator

Complementary Split
Analogous Scheme

Gradient Preview

How to Use the Color Suite

  1. Choose a color from the canvas color picker or enter HEX, RGB, HSL, HSV, or OKLCH values.
  2. Examine the **WCAG Contrast score** to verify readability limits. 4.5:1 ratio is required for standard AA validation.
  3. Copy the generated CSS custom properties to paste colors directly into your stylesheets.

Frequently Asked Questions

What is OKLCH format?

OKLCH is a modern color definition standard that provides predictable brightness mappings based on human vision. It represents colors via Oklab Lightness (0-1), Chroma (saturation, 0-0.4), and Hue angle (0-360).

What are WCAG Contrast Ratios?

The Web Content Accessibility Guidelines require body text to have a contrast ratio of at least **4.5:1** against backgrounds (AA standard), and **7:1** for optimal accessibility (AAA standard).

ESC