# Gerador de Sombras de Cor Gere variações mais escuras de uma cor adicionando preto, criando sombras ricas para profundidade e contraste no design > Página canônica: https://elysiatools.com/pt/tools/color-shade - **Categoria:** Design - **Palavras-chave:** cor, sombra, escurecer, preto, profundidade, contraste, variações, mais escuro, sombra, matiz ## Visão geral O Gerador de Sombras de Cor permite criar variações mais escuras de qualquer cor base, adicionando tons de preto para conferir profundidade, contraste e hierarquia visual aos seus projetos de design. ## Entradas - **Cor Base** (color) - **Método de Sombra** (select) - **Número de Sombras** (number): Quantas variações de sombra gerar - **Intensidade da Sombra** (number): Máxima escuridão (0.1-1.0) - **Distribuição dos Passos** (select) - **Valores de Passos Personalizados** (text): Valores separados por vírgula (ex: 0.1,0.3,0.5,0.7,0.9) - **Incluir Cor Original** (checkbox) - **Mostrar Códigos HEX** (checkbox) - **Mostrar Valores RGB** (checkbox) - **Mostrar Valores HSL** (checkbox) - **Gerar Paleta Estendida** (checkbox) ## Quando usar - Ao criar paletas de cores para interfaces de usuário que exigem estados de hover ou botões pressionados. - Para adicionar profundidade a elementos gráficos, como sombras projetadas ou gradientes sutis. - Ao desenvolver sistemas de design que precisam de variações consistentes de uma cor primária para textos ou fundos. ## Como funciona - Selecione a cor base utilizando o seletor de cores ou inserindo o código HEX. - Escolha o método de sombreamento, como linear, HSL ou LAB, para definir como a cor será escurecida. - Ajuste o número de variações desejadas e a intensidade da sombra para obter o resultado preciso. - Visualize os códigos HEX, RGB e HSL gerados e copie-os diretamente para o seu software de design. ## Casos de uso - Criação de estados de interação para botões (hover, active, disabled). - Desenvolvimento de paletas de cores para temas de modo escuro (dark mode). - Geração de gradientes suaves para fundos de sites e elementos de interface. ## Perguntas frequentes ### Como o método de sombreamento afeta a cor? Diferentes métodos alteram a matemática da cor. O método linear adiciona preto puro, enquanto o HSL ajusta a luminosidade e o LAB preserva melhor a percepção visual da cor. ### Posso gerar sombras com passos personalizados? Sim, ao selecionar o método 'Passos Personalizados', você pode definir valores específicos de intensidade separados por vírgula. ### O que é a distribuição de passos exponencial? A distribuição exponencial cria variações que escurecem mais rapidamente à medida que se afastam da cor original, ideal para sombras profundas. ### É possível exportar os valores em diferentes formatos? Sim, a ferramenta exibe automaticamente os códigos HEX, RGB e HSL para cada variação gerada. ### A cor original é incluída na lista de resultados? Sim, você pode marcar a opção 'Incluir Cor Original' para manter a cor base como referência no topo da sua nova paleta. ## Ferramentas relacionadas - [Cores Analógicas](https://elysiatools.com/pt/tools/color-analogous): Gerar esquemas de cores análogas harmoniosas com cores adjacentes na roda de cores, criando combinações unificadas e pacíficas - [Gerador de Gradiente de Cores](https://elysiatools.com/pt/tools/color-gradient-generator): Gera gradientes de cores suaves entre múltiplas cores com passos e formatos personalizáveis - [Deslocador de Matiz de Cor](https://elysiatools.com/pt/tools/color-hue-shifter): Desloque matizes de cores e crie variações com controles de rotação horária/antihorária - [Clarear/Escurecer Cor](https://elysiatools.com/pt/tools/color-lighten-darken): Ajuste o brilho das cores e crie variações - [Saturação/Dessaturação de Cor](https://elysiatools.com/pt/tools/color-saturate-desaturate): Ajuste a saturação das cores e crie variações de saturação - [Gerador de Esquemas de Cores](https://elysiatools.com/pt/tools/color-scheme-generator): Gera esquemas de cores e paletas profissionais para projetos de design - [Ferramenta de Cores Complementares Divididas](https://elysiatools.com/pt/tools/color-split-complement): Criar contraste harmonioso com esquemas de cores complementares divididas usando uma cor base e duas cores adjacentes ao seu complemento - [Ferramenta de Tétrade de Cores](https://elysiatools.com/pt/tools/color-tetrad): Gerar esquemas de cores tétricas com quatro cores dispostas em padrões retangulares na roda de cores, criando relacionamentos de cores ricos e complexos ## Exemplos - [Exemplos de códigos de cor](https://elysiatools.com/pt/samples/color-code): Coleção de códigos de cor em vários formatos (Hex, RGB, HSL, cores com nome) para testes de validação - [Exemplos de Processamento de Imagem Android Java](https://elysiatools.com/pt/samples/android-image-processing-java): Exemplos de processamento de imagem Android Java incluindo leitura/escrita, dimensionamento e conversão de formato - [Exemplos de Processamento de Imagem Android Kotlin](https://elysiatools.com/pt/samples/android-image-processing-kotlin): Exemplos de processamento de imagem Android Kotlin incluindo leitura/escrita, dimensionamento e conversão de formato - [Exemplos de Processamento de Imagem Web Python](https://elysiatools.com/pt/samples/web-image-processing-python): Exemplos de processamento de imagem Web Python usando PIL/Pillow incluindo leitura, salvamento, redimensionamento e conversão de formato ## Conteúdo relacionado - [Ferramentas para sistemas de cores acessíveis](https://elysiatools.com/pt/hubs/color-design-tools): Crie um sistema de cores reutilizável transformando cores, gerando harmonias, verificando contraste e visão de cores e documentando tokens. - [Fluxo de sistema de cores e efeitos CSS](https://elysiatools.com/pt/hubs/design-generate): Extrair uma paleta, construir relacoes acessiveis, gerar tokens e aplicar efeitos CSS coerentes em estados reais de interface.