# Gerador de tons e matizes de cor

> Crie escalas rotuladas de luminosidade a partir de uma cor base.

[Open tool](https://www.toolcabana.com/pt-br/color-shade-and-tint-generator) · [Design e CSS](https://www.toolcabana.com/pt-br/category/design-and-css)

Tool ID: color-shade-and-tint-generator. Requested language: pt-BR. Description language: pt-BR. Complete guide translation: yes.

## Overview (en)

Color shade and tint generator builds a labeled lightness scale from one base color: tints blended toward white, the base itself, and shades blended toward black. Choose 2 to 10 steps per direction for up to 21 colors, each listed with its HEX code in a table and shown as a swatch with black or white text chosen by luminance.

## Supported tasks (pt-BR)

Crie escalas rotuladas de luminosidade a partir de uma cor base. Gera escalas determinísticas em vez de outra ferramenta genérica de paletas.

## Steps (pt-BR)

1. Digite os valores solicitados no painel de configurações.
2. Configure a cor base e os passos por direção.
3. Execute o gerador de tons e matizes de cor, revise a saída e use os controles disponíveis para copiar ou baixar.

## Settings

- Cor base (pt-BR; key: color; type: color)
- Passos por direção (pt-BR; key: steps; type: number); minimum: 2; maximum: 10

## Limitations (pt-BR)

As imagens usam o limite existente de 32 megapixels. São permitidas até 100 imagens de origem onde houver suporte. O HTML colado é limitado a 200,000 caracteres; diagramas Mermaid a 20,000 caracteres e 300 linhas. A geração de SVG e PNG exige um navegador.

## Privacy and connections (pt-BR)

Esta operação processa sua fonte no seu navegador. Copiar e baixar são ações explícitas; a entrada de origem não é salva em conta nem em histórico.

## Questions (pt-BR)

### How are tints and shades calculated?

Each RGB channel is blended linearly. Tint i moves the color i/(steps + 1) of the way toward white, and Shade i moves it the same fraction toward black, so pure white and black are never reached. The same input always gives the same scale.

### How many colors does the shade and tint generator produce?

Twice the steps per direction, plus the base. With the default of 5 steps you get Tint 5 to Tint 1, Base and Shade 1 to Shade 5, eleven colors in total; the maximum of 10 steps gives 21.

### Can I export the color scale?

The results table holds Label and HEX columns and copies as tab-separated text, so it pastes into spreadsheets or design notes. You can then rename labels such as Tint 3 to your own token names.

### Onde minha entrada é processada?

Esta operação processa sua fonte no seu navegador. Copiar e baixar são ações explícitas; a entrada de origem não é salva em conta nem em histórico.

### Quais são os limites de entrada?

As imagens usam o limite existente de 32 megapixels. São permitidas até 100 imagens de origem onde houver suporte. O HTML colado é limitado a 200,000 caracteres; diagramas Mermaid a 20,000 caracteres e 300 linhas. A geração de SVG e PNG exige um navegador.

## Related tools

- [CSS clamp calculator](https://www.toolcabana.com/pt-br/css-clamp-calculator)
- [CSS grid layout generator](https://www.toolcabana.com/pt-br/css-grid-layout-generator)
- [CSS flexbox playground](https://www.toolcabana.com/pt-br/css-flexbox-playground)
- [CSS cubic Bezier editor](https://www.toolcabana.com/pt-br/css-cubic-bezier-editor)