Gerador de Matizes de Cor Gere matizes mais escuros de qualquer cor com quantidade de passos ajustável.
Gerador de Matizes de Cor
Gere matizes mais escuros de qualquer cor com quantidade de passos ajustável.
Escolha a Cor Base
Selecione qualquer cor como seu ponto de partida.
Ajuste as Etapas
Escolha quantas sombras progressivamente mais escuras você deseja gerar.
Copiar Sombras
Copie sombras individuais ou todo o conjunto.
What Is Gerador de Matizes de Cor?
Um gerador de tons de cor cria versões progressivamente mais escuras de qualquer cor base reduzindo sistematicamente sua claridade no espaço de cor HSL. Os tons mantêm a tonalidade original e a saturação enquanto se movem em direção ao preto, criando um conjunto coeso de variantes mais escuras. Isso é essencial para sistemas de design onde você precisa de múltiplas intensidades de uma cor de marca - desde a original para botões primários até versões profundas para texto, bordas e estados de hover. Ao contrário de simplesmente adicionar preto em RGB (o que pode alterar a tonalidade percebida), a abordagem baseada em HSL preserva a identidade da cor ao longo de toda a gama de tons. A contagem de etapas ajustável permite criar qualquer coisa, desde um conjunto simples de três tons até uma escala abrangente de quinze etapas.
Why Use Gerador de Matizes de Cor?
-
O escurecimento baseado em HSL preserva a consistência da tonalidade em todas as sombras
-
Contagem de etapas ajustável (3 a 15) para qualquer caso de uso
-
Cada sombra mostra seu percentual de claridade para referência
-
Perfeito para criar escalas de cores de sistemas de design
-
Cópia com um clique para sombras individuais ou conjunto completo
Common Use Cases
Tokens de Design
Gere escalas de sombras numeradas (600, 700, 800, 900) para sistemas de design.
Estados de Hover
Crie estados de hover de botões mais escuros que sejam consistentes com a cor base.
Cores de Texto
Encontre sombras escuras de cores de marca para títulos e texto do corpo.
Bordas e Sombras
Obtenha variantes mais escuras para bordas, contornos e cores de sombra.
Technical Guide
O gerador de tons converte a cor base para HSL e cria N tons reduzindo a claridade do valor base para perto de zero. A fórmula para cada tom é: L = baseLightness × (1 - i/(N-1)), onde i vai de 0 a N-1. Isso cria uma distribuição uniforme da cor original até quase-preto. A tonalidade e a saturação permanecem constantes, garantindo que todos os tons sejam perceptualmente a mesma cor em diferentes níveis de escuridão. Na teoria das cores, um tom é especificamente uma cor misturada com preto, em oposição a um matiz (misturado com branco) ou uma tonalidade (misturada com cinza). A abordagem HSL é mais uniforme perceptualmente do que o escurecimento RGB, que exigiria ajustar todos os três canais proporcionalmente.
Tips & Best Practices
-
1Use 9 etapas para criar uma escala de sistema de design padrão (100-900)
-
2A sombra mais escura funciona bem para texto em fundos claros
-
3Combine geradores de sombras e tons para uma escala de cores completa
-
4Sombras de cores quentes (vermelhos, laranjas) fazem excelentes fundos escuros
-
5Teste as sombras escuras para garantir contraste suficiente contra o fundo pretendido
Related Tools
Seletor de Cores
Seletor de cores interativo com saídas em HEX, RGB, HSL e CMYK.
🎨 Color Tools
Gerador de Paleta Monocromática
Gere uma paleta de cores monocromáticas a partir de qualquer cor base.
🎨 Color Tools
Gerador de Matizes de Cor
Gere matizes mais claros de qualquer cor com quantidade de etapas ajustável.
🎨 Color Tools
Misturador de Cores
Misture duas cores juntas com uma proporção ajustável e veja o gradiente completo.
🎨 Color Tools
Verificador de Razão de Contraste
Verifique as razões de contraste da WCAG entre cores de primeiro plano e segundo plano.
🎨 Color ToolsFrequently Asked Questions
Q Qual é a diferença entre uma sombra e um tom?
Q Por que não apenas escurecer em RGB?
Q Quantas etapas devo usar?
About This Tool
Gerador de Matizes de Cor is a free online tool by FreeToolkit.ai. All processing happens directly in your browser — your data never leaves your device. No registration or installation required.