Seletor de cores e gerador de paletas

Leia qualquer cor em todas as notações ao mesmo tempo, monte uma paleta harmônica em torno dela e copie tudo no formato que seu projeto usa.

Seletor de cores e gerador de paletas

Click the color swatch or enter a value in any format — all other fields update instantly.

#6366F1
°
%
%
HEX#6366F1
RGBrgb(99, 102, 241)
HSLhsl(239, 84%, 67%)
HSVhsv(239, 59%, 95%)
CSS--color-primary: #6366F1;
SHADES

🔒 All color processing happens 100% in your browser — no data is sent anywhere.

Por que usar esta ferramenta

Paletas construídas com teoria das cores

Esquemas harmônicos nascem de relações fixas no círculo cromático. Pares complementares ficam opostos e geram contraste máximo; conjuntos análogos ficam lado a lado e transmitem calma; conjuntos triádicos são igualmente espaçados e mantêm vivacidade sem perder equilíbrio.

Perguntas frequentes

O que significa o código HEX?

São três pares de dígitos hexadecimais para vermelho, verde e azul, cada um de 00 a FF. #FF0000 é vermelho pleno, sem verde nem azul.

Quando usar HSL em vez de HEX?

HSL separa matiz, saturação e luminosidade, então criar uma escala de tons vira uma questão de mudar um número em vez de adivinhar novos valores hexadecimais.

As paletas exportadas são acessíveis?

O gerador mostra as razões de contraste para você conferir qualquer par contra o limite WCAG AA de 4,5:1 para texto corrido antes de publicar.

Mais guias e conversores estão disponíveis em inglês →