Gerador de tons 50 a 950
Gere a escala 50–950 de qualquer cor, pronta para o seu design system.
--color-50: #F2FAFC; --color-100: #DDF1F8; --color-200: #B3E0F0; --color-300: #89CEE8; --color-400: #5FBDDF; --color-500: #35ACD7; --color-600: #248FB5; --color-700: #1C6E8B; --color-800: #134C61; --color-900: #0B2B37; --color-950: #071B22;
Como usar
O Gerador de tons 50 a 950 é uma ferramenta online e gratuita para trabalhar com cores direto no navegador, sem instalar nada e sem criar conta. Gere a escala 50–950 de qualquer cor, pronta para o seu design system.
Como usar
1. Abra a ferramenta e informe a cor de partida (código HEX, RGB, HSL ou uma imagem, conforme o caso).
2. Ajuste as opções disponíveis e veja o resultado atualizado em tempo real.
3. Copie o código gerado com um clique e cole direto no seu CSS, no Figma ou no seu editor de imagens.
Quando usar
Use esta ferramenta em projetos de design, identidade visual, sites, apps e materiais impressos, sempre que precisar de precisão nos códigos de cor e consistência entre telas e mídias. Ela também ajuda a documentar a paleta do projeto e a padronizar as cores usadas pela equipe.
Termos relacionados: escala de cores, tons 50 950, tailwind shades, design system cores.
Todo o processamento acontece no seu navegador: as suas imagens e cores não são enviadas para servidores.