O que é Conversor de códigos de cor?

O Conversor de Códigos de Cores transforma qualquer valor de cor em HEX, RGB, HSL, CMYK e HSV ao mesmo tempo. Digite um código, cole um nome CSS como rebeccapurple, ou clique na amostra para escolher visualmente; os outros formatos se atualizam na hora para você copiar o que sua folha de estilos ou a gráfica pedirem.

Digite ou cole um valor em qualquer formato (#FF5733, rgb(255,87,51), hsl(11,100%,60%), cmyk(0%,66%,80%,0%), hsv(11,80%,100%)) ou um nome de cor CSS como tomato ou cornflowerblue. A ferramenta detecta o formato e preenche os outros quatro. A amostra ao lado confirma que o valor foi interpretado certo, e clicar nela abre o seletor de cores nativo do seu dispositivo para escolher visualmente qualquer tom. Útil quando o arquivo de design entrega um formato e a folha de estilos, o programa de design ou a gráfica pede outro.

Como usar

  1. Passo 1 - Insira um valor de cor em qualquer formato suportado, ou um nome CSS como tomato (ex.: #FF5733, rgb(255,87,51), hsl(11,100%,60%)).
  2. Passo 2 — A ferramenta detecta automaticamente o formato de entrada e converte para todos os outros formatos em tempo real.
  3. Passo 3 - Copie qualquer valor convertido clicando nele, ou clique na amostra de cor para abrir um seletor visual e pegar um novo tom.

Quando usar

  • Converter HEX de marca para CMYK antes de enviar a arte para a gráfica.
  • Ler um RGB em uma captura de tela e devolvê-lo como HEX no CSS.
  • Conferir o matiz HSL do designer contra o HEX original do manual de marca.

Resultado

Um desenvolvedor web tem a cor da marca #2196F3 de um ficheiro de design e precisa do valor RGB para uma animação CSS — a ferramenta mostra instantaneamente rgb(33, 150, 243) junto com os equivalentes HSL e CMYK.

Perguntas frequentes

Por que o CMYK não bate exatamente com o do software de gráfica?
A tela usa RGB aditivo, a gráfica usa CMYK subtrativo. A ferramenta aplica a fórmula padrão, mas perfis comerciais (Coated FOGRA39, GRACoL) ajustam alguns pontos conforme tinta e papel reais. Trate o CMYK aqui como um ponto de partida próximo.
O que acontece se eu colar uma cor inválida tipo #ZZZ?
Os outros campos ficam vazios e a amostra de cor some. Os resultados só são atualizados quando o valor casa com um padrão válido de HEX, RGB, HSL ou CMYK, evitando conversões pela metade que possam te confundir.
Os HEX curtos tipo #F53 funcionam?
Sim. O HEX de três dígitos é a forma curta do de seis: #F53 equivale a #FF5533, e o conversor aceita os dois. A saída é sempre a versão de seis dígitos, para que ao colar em outro lugar não haja ambiguidade.
Qual a diferença entre HSL e HSV?
Os dois começam pela matiz, mas HSL mede a luminosidade de preto a branco e HSV (também chamado de HSB) mede o brilho em relação à cor pura. Este conversor agora mostra HSL e HSV lado a lado, já que CSS usa HSL e o Photoshop usa HSV, e designers precisam converter entre os dois com frequência.
A ferramenta aceita transparência ou canal alfa?
Neste conversor, não. HEX, RGB, HSL e CMYK aqui são valores opacos. Para preenchimento com transparência você usaria HEX de 8 dígitos (#RRGGBBAA) ou rgba(), que ficam fora dos quatro formatos cobertos.

Ferramentas relacionadas