Neste artigo
Formatos de Cor Explicados
As cores em design digital e desenvolvimento web são representadas em múltiplos formatos adequados a diferentes contextos. HEX (#ff5733) é conciso e universal para a web. RGB (255, 87, 51) é intuitivo para mistura de cores. HSL (14°, 100%, 60%) é o mais legível por humanos para ajustar matiz, saturação e luminosidade.
Diferentes ferramentas utilizam diferentes formatos de cor — o software de design frequentemente prefere HSL, HTML/CSS usa HEX e RGB, bibliotecas de cores JavaScript podem usar vários formatos e o design para impressão usa CMYK. A conversão precisa entre eles requer fórmulas matemáticas.
Como Funciona a Conversão de Cores
O conversor aplica transformações matemáticas precisas entre espaços de cor.
- Análise HEX — descodifica códigos hexadecimais de 3 e 6 dígitos, com ou sem canal alfa
- Normalização RGB — lida com valores inteiros de 0 a 255 e representações em ponto flutuante de 0 a 1
- Cálculo HSL — converte de e para matiz (0-360°), saturação (0-100%) e luminosidade (0-100%)
Experimente gratuitamente — sem cadastro
Converter uma Cor →Quando Usar a Conversão de Cores
A conversão de cores é necessária sempre que as cores transitam entre diferentes ferramentas, formatos ou contextos.
- Design para código — converta valores de cor HSL do Figma/Sketch para HEX para implementação em CSS
- Consistência de marca — verifique se os valores de cor correspondem entre diferentes ferramentas de design e implementações de código
- Acessibilidade — calcule rácios de contraste (que utilizam luminância relativa a partir de valores RGB) para conformidade com WCAG
Perguntas Frequentes
Qual é a diferença entre RGB e RGBA?
RGBA adiciona um canal alfa ao RGB, representando opacidade de 0 (totalmente transparente) a 1 (totalmente opaco) ou de 0 a 255 nalguns contextos. Da mesma forma, HEXA adiciona dois dígitos hexadecimais para o alfa (por exemplo, #FF5733FF para totalmente opaco ou #FF573380 para 50% de opacidade). Os valores alfa permitem cores transparentes e semitransparentes.
Por que a conversão de uma cor e de volta nem sempre retorna o mesmo valor exato?
A conversão entre espaços de cor envolve aritmética de ponto flutuante e arredondamento. As conversões de ida e volta (RGB → HSL → RGB) podem ter pequenos erros de arredondamento no último dígito. Isto é normal e a diferença é imperceptível para o olho humano. Para trabalhos que exigem precisão, armazene sempre as cores num único formato canónico.
Qual é a diferença entre HSL e HSV/HSB?
HSL (Matiz, Saturação, Luminosidade) e HSV/HSB (Matiz, Saturação, Valor/Brilho) são modelos de cor cilíndricos diferentes. Em HSL, o branco puro é L=100% independentemente da saturação; em HSV, o branco puro é S=0%, V=100%. HSL é mais intuitivo para design web; HSV é comumente utilizado em controlos de interface de seleção de cores.