Variáveis CSS
Exporte cores como propriedades CSS personalizadas. Use Variáveis CSS online grátis, sem cadastro, com resultados rápidos e processamento seguro no navegador.
:root {
--primary: #6366f1;
--secondary: #ec4899;
--accent: #f59e0b;
--background: #ffffff;
--foreground: #1f2937;
}Variáveis CSS ajuda você a trabalhar com cores diretamente no navegador.
A ferramenta foi criada para designers, desenvolvedores e criadores que precisam de resultados rápidos e confiáveis.
Supported formats
How it works
Step 1
Abra Variáveis CSS
Step 2
Insira ou importe suas cores
Step 3
Copie, exporte ou reutilize o resultado
Erros comuns a evitar
- Esquecer de verificar o contraste pode prejudicar a legibilidade.
- Usar cores demais pode tornar a paleta difícil de aplicar.
Dicas de especialistas
- Mantenha as cores principais como variáveis CSS.
- Teste a paleta nos modos claro e escuro antes de publicar.
Privacy guaranteed: everything is processed locally in your browser.
O processamento ocorre localmente no navegador sempre que possível. Nenhuma conta é necessária.
Variáveis CSS para seus projetos de cor
Exporte cores como propriedades CSS personalizadas.
Variáveis CSS sem perda de precisão
As conversões usam valores exatos (HEX, RGB, HSL, OKLCH). Sem aproximação visual: você obtém a cor fiel à intenção do design.
Variáveis CSS grátis online
Sem cadastro, sem download. Variáveis CSS é 100% gratuito e funciona em qualquer navegador. O plano gratuito inclui 10 usos por dia.
Variáveis CSS rápido e seguro
O processamento ocorre diretamente no navegador para máxima velocidade. Nenhum dado é enviado aos nossos servidores: suas cores permanecem privadas.
Variáveis CSS para compartilhar e colaborar
Exporte resultados como HEX, RGB, HSL, CSS, JSON ou copie com um clique. Perfeito para compartilhar guia de cores com a equipe ou documentar um design system.
Descubra todas as nossas ferramentas de cor
Extraia, converta, gere paletas, gradientes e contrastes WCAG em poucos cliques.
Related tools
Guias e tutoriais
Aprenda a usar nossas ferramentas com nossos guias detalhados.
css-variables: guia prático de developer
Guia localizado para usar css-variables, entender boas práticas de developer e evitar erros comuns.
css-variables: guia prático de developer
Guia localizado para usar css-variables, entender boas práticas de developer e evitar erros comuns.
css-variables: guia prático de developer
Guia localizado para usar css-variables, entender boas práticas de developer e evitar erros comuns.