Conversor de Cores
Suporta detecção e conversão automática entre HEX, RGB, HSL e CMYK, com seletor de cores integrado, tints & shades, esquemas de cores e verificador de contraste WCAG. Todo o processamento é feito localmente no seu navegador — nenhum dado é enviado para servidores.
Seletor de Cores
Tints & Shades
Esquemas de Cores
Histórico
Favoritos
Verificador de Contraste WCAG
Selecione uma cor de fundo e primeiro plano para verificar a conformidade de acessibilidade WCAG
O que é um Conversor de Cores?
Um Conversor de Cores é uma ferramenta online que ajuda desenvolvedores a converter livremente entre diferentes formatos de cor. Os formatos de cor mais usados no desenvolvimento web incluem HEX (hexadecimal), RGB (Red-Green-Blue), HSL (Hue-Saturation-Lightness) e CMYK (Cyan-Magenta-Yellow-Key para impressão). Esta ferramenta suporta detecção automática do formato de entrada e exibe simultaneamente todos os quatro formatos, melhorando muito a eficiência do seu fluxo de trabalho com cores.
Referência de Formatos de Cor
- HEX — Código de cor hexadecimal, prefixado com
#, ex.#ff6600. O formato de cor mais utilizado em CSS. - RGB — Representação Vermelho, Verde, Azul, ex.
rgb(255, 102, 0). Cada canal varia de 0 a 255. - HSL — Matiz (0-360°), Saturação (0-100%), Luminosidade (0-100%). O modelo de cor mais intuitivo para humanos.
- CMYK — Ciano, Magenta, Amarelo, Preto (Key). O formato padrão para a indústria gráfica.
- Cores Nomeadas CSS — Mais de 140 nomes de cores definidos pela W3C, como
rebeccapurpleecoral.
Casos de Uso Comuns
- Design de UI — Designers fornecem valores HEX; desenvolvedores precisam de HSL para ajustar claridade e escuridão
- Estados de Botões — Use Tints & Shades para gerar escalas de cores para hover/active
- Cores da Marca — Gere combinações de esquemas complementares, tríade e outros
- Teste de Acessibilidade — Use o verificador de contraste WCAG para garantir a legibilidade do texto
- Gradientes CSS — Salve paletas nos favoritos para gerar gradientes posteriormente
Padrões de Contraste WCAG
- Padrão AA — Texto normal ≥ 4,5:1, texto grande ≥ 3:1
- Padrão AAA — Texto normal ≥ 7:1, texto grande ≥ 4,5:1