Anúncios incomodam? Ir Sem anúncios Hoje 

Gerador de Tons, Tomes e Escalas de Cor

CorDesenvolvedor

ANUNCIADO Remover?

ENTRADA

Processo Automático

SAÍDA

Lado cliente

ANUNCIADO Remover?

Guia

Gerador de Tons, Tomes e Shades de Cor

Escolha uma cor em hex ou RGB e obtenha instantaneamente 10 tons (sua cor misturada para branco) e 10 tons escuros (misturada para preto) como amostras visuais. Clique em qualquer amostra para copiar seu código hexadecimal, ou exporte o conjunto completo como propriedades CSS personalizadas, variáveis SCSS, JSON ou uma lista simples de hex.

Como usar

Escolha uma cor base com o seletor de cores ou cole qualquer valor hexadecimal (3 ou 6 dígitos) no campo Hex.
Opcional: altere o nome da variável (usado nas chaves exportadas em CSS/SCSS/JSON).
Escolha um método de mistura. O OKLCH oferece o gradiente mais suave, o HSL é a abordagem clássica da web e o RGB é a mistura linear mais simples.
Escolha um formato de exportação. A exportação atualiza em tempo real conforme você mudar qualquer coisa.
Clique em qualquer amostra para copiar seu hex, ou use os botões Copiar / Baixar no painel de código exportado.

Características

10 tons + 10 tons escuros – duas faixas de amostras com incrementos de 10%, indo de uma mistura subtil de 10% até uma mistura quase pura de 100%.
Três métodos de mistura – OKLCH para passos perceptualmente uniformes, HSL para mudanças de luminosidade que preservam a cor, ou RGB direto.
Amostras clicáveis – cada célula mostra seu hex e copia para a área de transferência com um único clique.
Vários formatos de exportação – propriedades CSS personalizadas, variáveis SCSS, paleta JSON ou uma lista simples e legível de hex.
Pré-visualização em tempo real – cada alteração na cor, nome, método ou formato atualiza imediatamente as amostras e o código.
Baixar a exportação – salve a paleta gerada em um arquivo com a extensão correta para o formato escolhido.

 Perguntas frequentes

Qual a diferença entre um tom e um tom escuro?

Um tom é a cor original misturada com branco, o que a torna mais clara e suave. Um tom escuro é a cor original misturada com preto, o que a torna mais escura e profunda. Juntos, formam o intervalo de valor de uma única cor.
Por que o OKLCH geralmente parece mais suave do que o RGB ou o HSL?

O OKLCH foi projetado para corresponder à forma como os olhos humanos percebem a luminosidade e o tom, então passos numéricos iguais parecem iguais visualmente. O RGB e o HSL operam no espaço de cor do dispositivo, então um passo numérico igual pode parecer um salto muito maior ou menor dependendo do ponto em que você está na escala.
Como os tons e tons escuros diferem de uma paleta de cores?

Uma paleta é um conjunto curado de tons distintos que funcionam juntos (por exemplo, um principal, um destaque e neutros). Os tons e tons escuros são variações de uma única cor ao longo do eixo de luz e escuridão. Os sistemas de interface geralmente combinam os dois: escolha alguns tons base e gere tons e tons escuros de cada um.