Como usar
- Digite uma cor, como #2451E8, no campo de entrada e clique em Aplicar.
- Edite o campo RGB para ajustar a cor e atualizar os outros códigos.
- Escolha uma cor em Comparar com para verificar o contraste com a cor selecionada.
- Clique em Copiar link para compartilhar a cor selecionada.
Exemplos
Converter a cor de uma marca para CSS
#2451E8
HEX: #2451E8 RGB: rgb(36, 81, 232) HSL: hsl(226, 81%, 53%) HSV: hsv(226, 84%, 91%) CMYK: cmyk(84%, 65%, 0%, 9%) Nome: ≈ MediumSlateBlue vs. branco: 6.14:1 — ✓ AA, ✓ AA grande, ✕ AAA, ✓ AAA grande vs. preto: 3.41:1 — ✕ AA, ✓ AA grande, ✕ AAA, ✕ AAA grande
Verificar o contraste de texto cinza sobre branco
#767676
HEX: #767676 RGB: rgb(118, 118, 118) HSL: hsl(0, 0%, 46%) HSV: hsv(0, 0%, 46%) CMYK: cmyk(0%, 0%, 0%, 54%) Nome: ≈ Gray (grey) vs. branco: 4.54:1 — ✓ AA, ✓ AA grande, ✕ AAA, ✓ AAA grande vs. preto: 4.62:1 — ✓ AA, ✓ AA grande, ✕ AAA, ✓ AAA grande
Consultar uma cor pelo nome CSS
Dark Orange
HEX: #FF8C00 RGB: rgb(255, 140, 0) HSL: hsl(33, 100%, 50%) HSV: hsv(33, 100%, 100%) CMYK: cmyk(0%, 45%, 100%, 0%) Nome: DarkOrange vs. branco: 2.33:1 — ✕ AA, ✕ AA grande, ✕ AAA, ✕ AAA grande vs. preto: 9.00:1 — ✓ AA, ✓ AA grande, ✓ AAA, ✓ AAA grande
Nomes de cores HTML (148)
Todos os 148 nomes de cores CSS suportados pelos navegadores modernos, agrupados por família. Clique em uma linha para carregar a cor ou em um valor HEX ou RGB para copiá-lo.
| Cor | Nome | HEX | RGB |
|---|
Perguntas frequentes
Onde encontro a tabela de cores HTML?
A tabela abaixo do seletor reúne 148 nomes de cores CSS com códigos HEX e RGB. Use Filtrar por nome ou HEX… para localizar uma cor. Clicar no código HEX ou RGB copia o valor.
Posso usar códigos de cores com transparência?
A ferramenta aceita entradas com alpha, como HEX de oito dígitos e rgba(), mas ignora a transparência e exibe um aviso. Os resultados mostram apenas cores opacas em sRGB.
O código CMYK serve para impressão?
O CMYK exibido é uma aproximação calculada sem perfil de cor. Para impressão, use o perfil da sua impressora.
Como pegar o código de uma cor da tela?
Clique em Capturar da tela e selecione a cor desejada. Esse botão só aparece em navegadores com suporte à API EyeDropper.
Qual contraste é necessário para passar no WCAG AA?
No WCAG 2.x, o nível AA exige contraste de pelo menos 4,5:1 para texto normal e 3:1 para texto grande. A ferramenta mostra indicadores separados para AA, AA grande, AAA e AAA grande.