Saltar para conteúdo principal
gerador.site

Conversor de Cores

Converte entre HEX, RGB, HSL e nome CSS.

Como funciona

Cores digitais expressam-se em múltiplos modelos: HEX (#RRGGBB), RGB (0-255), HSL (matiz, saturação, luminosidade) e nomes CSS (tomato, rebeccapurple). Conversão precisa é vital em design systems, theming web e acessibilidade (contraste WCAG).

A ferramenta detecta formato de input, converte para todos os modelos suportados, mostra preview visual e permite copiar qualquer representação. Cálculos client-side instantâneos apoiam iteracção em workshops de marca e ajuste de variáveis CSS/Tailwind.

Designers, developers frontend e equipas de marketing mantêm consistência entre Figma, código e documentação de marca.

Design tokens em CSS moderno usam HEX e HSL — conversão rápida alinha Figma, Tailwind e documentação de marca. Preview visual detecta erros de parsing antes de deploy. Contraste WCAG para acessibilidade requer cálculo adicional além da mera conversão de formato.

Developers Tailwind traduzem cores de brand book HEX para valores hsl() usados em custom properties CSS modernas.

Equipas de acessibilidade traduzem cores de brand para HSL ajustando luminosidade até cumprir contraste mínimo WCAG AA.

Themes dark mode ajustam luminosidade HSL de cores de brand mantendo matiz reconhecível.

Copia valores no formato preferido do teu stack CSS ou design system para evitar erros de transcrição manual.

**Aviso:** perfis de cor (sRGB vs Display P3) afetam percepção em ecrãs distintos — preview é orientativo.

Perguntas frequentes

Aceita HEX de 3 dígitos (#abc)?
Sim. Formato curto expande para #aabbcc automaticamente.
Converte para HSL?
Sim. RGB intermedía conversões precisas para HSL e vice-versa.