Conversor de Cores + Paleta

Converta cores entre HEX, RGB, HSL, HSB e CMYK. Gere paletas complementares, análogas, triádicas e outras. Verifique taxas de contraste WCAG. Todo processamento acontece no seu navegador.

100% no navegador. Seus dados nunca saem do seu computador.

#3b82f6
R
G
B
Formatos
HEX#3b82f6
RGBrgb(59, 130, 246)
HSLhsl(217, 91%, 60%)
HSBhsb(217, 76%, 96%)
CMYKcmyk(76%, 47%, 0%, 4%)
Contraste WCAG
3.68:1AA Large
5.71:1AA
Paleta
Enviar para:

Conversores e Exemplos

Conversor de HEX para RGB: Tradutor de Códigos de Cor

Converta códigos de cor HEX como #3b82f6 para valores RGB (59, 130, 246). Aborda notação abreviada hex, canais alfa, usó em CSS.

 Conversor de RGB para HSL: Tradutor de Modelo de Cor

Converta valores de cor RGB para HSL (Matiz, Saturação, Luminosidade). Entenda modelos de cor para CSS, sistemas de design e manipulação programática de cores.

 Cor Tailwind CSS para HEX: Consulta de Cores

Consulte nomês de cores do Tailwind CSS e obtenha seus valores HEX. blue-500 é #3b82f6, gray-900 é #111827. Referência rápida da paleta de cores do Tailwind.

Ferramentas Relacionadas

sha
Gerador de Hashes

Gera hashes MD5, SHA-1, SHA-256 e SHA-512 a partir de texto ou arquivos. Usa Web Crypto API para SHA e JavaScript puro para MD5.

 %20
Codificador de URL e Codificador de Entidades HTML

Codifique texto para URLs com encodeURIComponent ou encodeURI e escape caracteres especiais HTML para entidades nomeadas ou numericas. Tudo acontece no navegador.

Conversor de Cores + Gerador de Paletas

Converta cores entre formatos HEX, RGB, HSL, HSB/HSV e CMYK instantaneamente. Escolha uma cor visualmente ou digite qualquer valor de cor CSS, cor nomeada ou string de formato bruto. A ferramenta gera todas as representações de formato simultaneamente e produz paletas baseadas em teoria das cores.

Como Usar

  1. Escolha uma cor. Clique na prévia da cor para abrir o seletor de cor do sistema, digite um valor no campo de entrada ou arraste os controles deslizantes RGB
  2. Leia as conversões. Todos os cinco formatos (HEX, RGB, HSL, HSB, CMYK) atualizam em tempo real
  3. Copie qualquer formato. Clique em Copiar ao lado do formato que você precisa, ou Copiar Tudo
  4. Gere paletas. Selecione um tipo de harmonia (complementar, análoga, triádica, etc.)
  5. Verifique o contraste. A taxa de contraste WCAG contra branco e preto é mostrada automaticamente

Como os Modelos de Cor Funcionam

Cada cor na sua tela é produzida misturando luz vermelha, verde e azul em diferentes intensidades. RGB expressa issó diretamente: três canais, cada um variando de 0 a 255, dando 16,7 milhões de cores possíveis. HEX é o mêsmo modelo escrito em base 16. #FF0000 é rgb(255, 0, 0).

HSL e HSB reorganizam a mêsma informação em uma forma que mapeia mais de perto como humanos pensam sobre cor. Matiz (Hue) é a posição no círculo cromático em graus (0 = vermelho, 120 = verde, 240 = azul). Saturação mede quão vívida a cor é versus cinza. O terceiro eixo difere: HSL usa claridade (0% = preto, 100% = branco, 50% = cor pura), enquanto HSB usa brilho (0% = preto, 100% = intensidade total). CSS usa HSL. Ferramentas de design como Figma, Sketch e Photoshop usam HSB.

CMYK (Ciano, Magenta, Amarelo, Preto) é um modelo subtrativo para impressão. As tintas absorvem luz em vez de emiti-la. A conversão de RGB para CMYK é uma apróximação matemática porque os dois espaços de cor não cobrem o mêsmo gamut.

O gerador de paletas usa o círculo cromático HSL para calcular harmonias de cor. Cores complementares estão a 180 graus de distância. Cores análogas estão a 30 graus de distância. Cores triádicas formam um triângulo equilátero no círculo.

Precisa codificar dados de cor para transporte? Codificador/Decodificador Base64 lida com codificação binária para texto. Trabalhando com parâmetros de URL que contêm valores de cor? O Codificador de URL garante que caracteres # e % sejam escapados corretamente.