Ir à ferramenta
OKLCH Studio

Verificador de contraste de cores que mantém o matiz

Ferramentas comuns só medem. Fix move a luminosidade do texto até AA sem drift de matiz. Seletor OKLCH e paleta local incluídos.

Full studio here. Need pairs, names, or brand-from-URL? Colorise Pro. · About

Pick
Photo
Read

Fluxo

  1. 01

    Contraste

    Fix AA.

  2. 02

    OKLCH

    Picker.

  3. 03

    Foto

    Local.

O verificador de contraste de cores que corrige a cor

Ferramentas comuns só medem. Aqui você vê WCAG 2.1 e APCA; Fix ajusta a luminosidade do texto até AA sem mudar o matiz. Seletor OKLCH e paleta de foto local.

Fix primeiro

Abra Contraste, defina texto e fundo, Fix com antes/depois.

Abrir Fix →

Seletor OKLCH

Plano L×C, export HEX, oklch(), Tailwind v4.

Seletor OKLCH →

Tailwind e nomes CSS

Referências em inglês com oklch(), pares WCAG e links para este Fix.

Paleta Tailwind (EN) →Nomes CSS (EN) →Fix de contraste →

Quando usar

Contraste ruim, tokens Tailwind v4, paleta de screenshot.

Erros

Corrigir contraste girando o matiz em vez da luminosidade.

CSS

Variáveis após Fix.

:root { --text: oklch(0.35 0.08 250); }

Seletor de cor OKLCH: OKLCH vs HSL vs HEX

HEX stores a display color. HSL is convenient but not perceptual. OKLCH separates lightness, chroma, and hue the way your eye expects — better for scales, contrast Fix, and UI tokens.

SpaceBest forWatch out
OKLCHScales, accessible pairs, CSS oklch()Wide-gamut colors may need clip to sRGB
HSLQuick hue spins in familiar UIsLightness shifts often change perceived hue
HEXCopy-paste into any design toolNo structure — hard to build systems

FAQ

Diferencial?

Fix preserva matiz/croma até WCAG AA.

Tailwind?

Hub /en/tailwind com links ?fg=&bg=.

Compartilhar?

Copy link no Contraste.