Gerador de Cores

Gere e converta cores entre HEX, RGB e HSL com verificador de contraste e harmonias de cores.

#
Vermelho
Verde
Azul
Matiz
°
Saturação
%
Luminosidade
%

Harmonias de Cores

Complementar

Análoga

Triádica

Verificador de Contraste WCAG

Aavs Branco
3.89:1
AA FalhouAA Large PassouAAA Falhou
Aavs Preto
5.39:1
AA PassouAA Large PassouAAA Falhou

Gerador e Seletor de Cores HEX/RGB

As cores na web são representadas em múltiplos formatos: HEX (hexadecimal como #FF5733), RGB (valores de vermelho, verde e azul de 0-255) e HSL (matiz, saturação, luminosidade). Cada formato tem seus casos de uso — HEX é compacto para CSS, RGB é intuitivo para mistura e HSL é natural para ajustar brilho e saturação.

Esta ferramenta permite gerar, selecionar e converter cores entre todos os três formatos em tempo real. Também calcula as proporções de contraste WCAG contra fundos branco e preto, ajudando a garantir que suas escolhas de cores atendam aos padrões de acessibilidade (níveis AA e AAA).

Como funciona

HEX para RGB: converte pares de dígitos hexadecimais para decimal 0-255. RGB para HSL: normaliza RGB para 0-1, calcula matiz pelo canal máximo, saturação por croma/luminosidade, luminosidade como (máx+mín)/2. Proporção de contraste WCAG: (L1 + 0,05) / (L2 + 0,05) onde L é a luminância relativa.

Casos de uso

  • Converter cores entre formatos HEX, RGB e HSL para CSS
  • Verificar acessibilidade de cores segundo padrões WCAG AA/AAA
  • Encontrar harmonias de cores complementares, análogas e triádicas
  • Gerar cores aleatórias para inspiração de design

Calculadoras Relacionadas