Conversor de Cores.

Converte cores entre HEX, RGB, HSL e CMYK instantaneamente. Escolhe uma cor visualmente ou insere valores — ideal para designers e programadores.

HEX
CMYK
RGB
R
G
B
HSL
H
S
L

Esta ferramenta converte códigos de cor entre os formatos HEX, RGB, HSL e CMYK em tempo real. Quer estejas a construir um site, a desenhar um logótipo ou a combinar cores de marca, basta escolher uma cor ou introduzir qualquer valor e os quatro formatos atualizam-se instantaneamente. Tudo corre no teu navegador — nenhum dado é enviado para um servidor.

Como usar

Clica na amostra de cor no topo para abrir o seletor de cor do teu dispositivo, ou escreve um código HEX diretamente no campo HEX (o # é opcional). Também podes ajustar os números R, G, B para RGB, ou os números H, S, L para HSL — todos os campos ficam sincronizados. O CMYK é atualizado automaticamente e é só de leitura. Clica em Copiar junto a qualquer formato para copiar o valor pronto para CSS.

A conversão de cor funciona melhor quando a mesma cor pode passar de forma limpa entre ferramentas

Um bom conversor de cor não serve realmente para gerar mais códigos. Serve para manter intacta a mesma decisão visual enquanto ela passa por ficheiros de design, CSS, bibliotecas de componentes e referências de impressão. A mesma cor pode precisar de HEX para uma entrega, RGB para implementação, HSL para ajuste e CMYK para um documento próximo da impressão.

Esta ferramenta mantém esses formatos alinhados num só lugar para que possa passar entre eles sem perder de vista a cor original.

Onde normalmente surge a fricção

Passagem de design para desenvolvimento

Uma pessoa fala em design tokens ou HEX, outra precisa de valores CSS, e um único carácter copiado de forma errada basta para produzir a tonalidade errada em produção.

Trabalho de marca

Uma cor de marca não é apenas uma ideia visual. É um conjunto de representações numéricas exatas que têm de permanecer alinhadas entre assets, código e documentação.

Resolução de problemas numa interface existente

Quando algo parece ligeiramente errado, verificar a mesma cor em vários formatos pode mostrar se o problema está no código, na conversão ou no valor de origem.

Os erros que importam

Assumir que valores parecidos são intercambiáveis

Dois valores podem parecer próximos e, ainda assim, não ser a mesma cor. Isso importa ainda mais quando um sistema de marca depende de consistência.

Tratar CMYK como idêntico à cor em ecrã

CMYK é útil como referência, mas fluxos de ecrã e impressão não são espelhos perfeitos. A conversão ajuda a traduzir, não a garantir um resultado físico idêntico.

Editar um formato e esquecer os outros

A vantagem de um conversor sincronizado é poder ajustar uma representação e manter imediatamente as restantes alinhadas.

Exemplos práticos

Levar uma cor escolhida para código de produção

Pode encontrar primeiro a tonalidade certa de forma visual e só depois precisar do valor HEX ou HSL exato para implementação.

Verificar um guia de estilo

Se um documento lista HEX, RGB e CMYK para a mesma cor de marca, um conversor facilita confirmar se esses valores ainda descrevem o mesmo resultado pretendido.

Depurar um elemento fora de marca

Quando um botão ou fundo parece errado, comparar saídas ligadas pode ajudar a isolar se o problema é um valor mal colado ou um mal-entendido de formato.

O que esta ferramenta não faz

Esta ferramenta converte formatos de cor. Não avalia contraste de acessibilidade, não constrói uma paleta completa e não substitui prova de impressão calibrada. Serve para transferência rigorosa de representações, não para todas as decisões de design sobre cor.

A disciplina útil por trás disto

O objetivo não é simplesmente gerar mais códigos. É manter uma identidade cromática coerente à medida que passa por diferentes partes de um fluxo de trabalho. É aí que os conversores poupam tempo real e evitam inconsistências visuais subtis.

Exemplos

Vermelho puro #ff0000 → rgb(255, 0, 0) → hsl(0, 100%, 50%)
Azul céu #87ceeb → rgb(135, 206, 235) → hsl(197, 71%, 73%)
Verde floresta #228b22 → rgb(34, 139, 34) → hsl(120, 61%, 34%)
Branco #ffffff → rgb(255, 255, 255) → CMYK C:0% M:0% Y:0% K:0%
Preto #000000 → rgb(0, 0, 0) → CMYK C:0% M:0% Y:0% K:100%

FAQ

O que é um código de cor HEX?

Um código HEX é uma cadeia de seis caracteres usada em design web e CSS para definir cores. Começa com # seguido de três pares de dígitos hexadecimais que representam os valores de vermelho, verde e azul — por exemplo, #ff0000 é vermelho puro.

Qual é a diferença entre RGB e CMYK?

RGB (Vermelho, Verde, Azul) é um modelo de cor aditivo usado em ecrãs — mistura luz. CMYK (Ciano, Magenta, Amarelo, Preto) é um modelo subtrativo usado em impressão. Os valores CMYK mostrados são uma aproximação matemática padrão a partir dos valores RGB.

Porque é que os meus valores CMYK diferem do software de impressão?

O software de impressão profissional usa perfis de cor ICC que variam conforme a impressora e o papel. Esta ferramenta calcula uma aproximação matemática padrão, ótima para uso web mas que pode diferir dos perfis específicos de impressão.

Esta ferramenta é gratuita e privada?

Sim — completamente gratuita e funciona inteiramente no teu navegador. Nenhum valor de cor é enviado para qualquer servidor.

Ferramentas relacionadas

Privacidade e dados

Esta ferramenta funciona inteiramente no seu navegador. Nada do que escreve ou cola é enviado para qualquer servidor — todo o processamento ocorre localmente no seu dispositivo.