Conversor de cores
Cole uma cor no formato HEX, RGB, RGBA ou HSL e converta-a instantaneamente com visualização ao vivo.
Cole HEX, RGB, RGBA ou HSL para convertê-lo instantaneamente.
HEX
RGB
RGBA
HSL
O que é um conversor de cores?
Um conversor de cores ajuda a transformar cores entre formatos comuns, como HEX, RGB, RGBA e HSL.
É útil para desenvolvimento de front-end, design de UI, trabalho de CSS, branding e qualquer fluxo de trabalho onde você precise de valores de cores em diferentes formatos.
Como usar o Conversor de Cores
- Cole um valor de cor como #4f46e5, rgb(79, 70, 229) ou hsl(243, 76%, 59%).
- Clique em Converter para gerar valores equivalentes.
- Ajuste alfa para visualizar a transparência em RGBA.
- Copie o formato que você precisa.
Dicas
- HEX é comum para CSS e sistemas de design.
- RGBA é útil quando você precisa de transparência.
- O HSL geralmente é mais fácil de ajustar manualmente para matiz, saturação e luminosidade.
- A visualização ao vivo ajuda a confirmar a cor exata convertida.
Verificações de color conversion antes de atualizar design tokens
Converter HEX, RGB, HSL e alpha values é mecânico, mas accessibility, contrast, naming e browser usage ainda importam.
Confira contrast
Compare foreground e background colors com accessibility requirements antes de usar converted values em UI text.
Preserve alpha intent
Revise RGBA e HSLA opacity porque transparent colors dependem do background atrás deles.
Normalize token names
Use consistent naming para brand, semantic, state e surface colors ao mover valores para um design system.
Teste in context
Preview converted colors em components, dark mode, hover states, charts e disabled states antes de shipping.
Ferramentas relacionadas
Você também pode achar essas ferramentas úteis.