Gerador de Tons de Cor
Gere variações de tons claros a escuros de qualquer cor. Ajuste o número de passos e exporte como paleta Tailwind CSS.
Selecionar cor base
Tons claros (cores mais claras)
Variações mais claras criadas misturando branco com a cor base
Tons escuros (cores mais escuras)
Variações mais escuras criadas misturando preto com a cor base
Como usar
Escolher Cor

Especifique a cor via seletor ou código HEX
Gerar Tons

Tons de claro a escuro gerados automaticamente
Copiar

Copie os códigos de cor dos tons desejados
Recursos
Controle de Passos
Ajuste o número de passos dos tons
Múltiplos Formatos
Copie nos formatos HEX, RGB, HSL
Exportar Paleta
Exporte a paleta no formato Tailwind CSS
FAQ
🔗Ferramentas relacionadas
Conversor de Código de Cor
Converta entre códigos de cor HEX, RGB e HSL. Use o seletor de cores e a visualização em tempo real para seleção intuitiva de cores.
Seletor de Cores
Selecione cores intuitivamente usando uma roda de cores e controles deslizantes. Obtenha e copie códigos de cor nos formatos HEX, RGB e HSL.
Extrator de Cores de Imagem
Detecte automaticamente as cores dominantes de uma imagem e gere uma paleta de cores. Você também pode clicar em qualquer lugar da imagem para selecionar cores individuais.
Seletor de Cor Média da Imagem
Calcule a cor média de uma imagem inteira ou de uma área selecionada. Útil para escolher esquemas de cores ou cores de fundo de miniaturas.
Gerador de Gradiente CSS
Crie visualmente gradientes CSS com controles de arraste. Suporta tipos de gradiente linear, radial e cônico com predefinições.
Gerador de CSS Box Shadow
Crie visualmente CSS box-shadow com controles deslizantes. Suporta múltiplas sombras e sombras internas.