Hex para nome de cor

Tokens de design, guias de marca e folhas de estilo costumam guardar cores como códigos hex, mas as pessoas ainda falam com nomes como tomato, cornflowerblue ou rebeccapurple. Esta ferramenta recebe um único valor hex CSS—três ou seis dígitos hexadecimais, com ou sem hash inicial—e devolve a cor CSS nomeada sólida mais próxima da paleta CSS Color Module Level 4 por distância euclidiana no espaço vermelho-verde-azul de oito bits. Quando o hex já coincide exatamente com uma cor nomeada, a resposta marca exact como true e a distância é zero. Quando fica entre palavras-chave, você ainda obtém um nome estável mais próximo, o hex e canais próprios da palavra-chave, e uma distância numérica para que revisões de design e regras de lint decidam quão perto é o bastante. Strings hex inválidas falham com erro de validação claro em vez de inventar um nome.

Como as cores CSS nomeadas mais próximas são escolhidas

Cada cor CSS nomeada sólida é uma tripla fixa de valores de canal vermelho, verde e azul de zero a 255, publicada na tabela de palavras-chave do CSS Color Module Level 4. Sua entrada é normalizada: hash inicial opcional, dígitos hex em minúsculas, e abreviação de três dígitos expandida dobrando cada nibble de modo que f zero zero se torna f f zero zero zero zero.

O algoritmo então mede a distância euclidiana no espaço RGB: a raiz quadrada da soma das diferenças de canal ao quadrado entre sua cor e cada tripla nomeada. Vence o nome com a menor distância. Quando duas palavras-chave compartilham os mesmos valores RGB—por exemplo aqua e cyan, ou fuchsia e magenta—ou quando duas triplas distintas caem na mesma distância numérica, o nome alfabeticamente primeiro é mantido para o resultado nunca oscilar entre execuções.

Distância zero significa acerto exato de paleta e a flag exact é true; distância positiva significa aproximação de vizinho mais próximo ainda útil em textos, notas de acessibilidade ou lint suave de paleta.

O que você envia e o que recebe de volta

Envie um campo string chamado hex. Formas aceitas são códigos de seis dígitos como hash f f five seven three three, abreviação de três dígitos como hash f zero zero, e as mesmas strings sem hash inicial. Espaços ao redor do valor são removidos.

Checagens clássicas incluem vermelho puro como hash f f zero zero zero zero resolvendo para red com exact true; quase-laranja hash f f five seven three three resolvendo perto de tomato com distância positiva; e códigos de seis dígitos sem hash resolvendo igual à forma com hash.

Onde a busca hex-para-nome aparece no trabalho real

Design systems e livros de marca costumam publicar cores primárias e de destaque como hex enquanto textos de produto, anotações de acessibilidade e slides para stakeholders precisam de nomes legíveis para as mesmas amostras. Regras de lint front-end e checagens de CI podem sinalizar valores hex personalizados distantes de qualquer palavra-chave CSS quando a equipe prefere cores nomeadas em folhas de estilo por legibilidade.

Autores de visualização de dados que mapeiam séries categóricas às vezes partem de rampas hex e querem a palavra-chave CSS mais próxima para legendas que devem renderizar sem imagens de amostra personalizadas. Se depois precisar de conversão multi-formato entre HEX, RGB, HSL, LAB e CMYK, conversão inversa só de nomes para hex, extração de cor dominante de imagens ou checagens de contraste WCAG, trate-os como intenções de busca e landings separadas em vez de sobrecarregar esta página dedicada de hex para nome de cor.