Gerador de gradientes CSS
Crie gradientes lineares, radiais e cônicos a partir da paleta. Ajuste o ângulo, visualize o resultado e copie o CSS.
Este guia explica o processo. Use a ferramenta indicada abaixo para gerar cores e exportar arquivos.
O que esta página explica
Esta página explica o processo e leva diretamente à seção correspondente da ferramenta principal do Chromoforge.
- Gradientes lineares, radiais e cônicos com visualização ao vivo.
- Controle de ângulo de 0 a 360 graus para gradientes lineares e cônicos.
- O gradiente usa a paleta atual: ao mudar a cor base, ele também é atualizado.
- Copie o valor CSS de background para sua folha de estilos ou para o código CSS-in-JS.
Qual tipo de gradiente combina com fundos de interface?
Gradientes lineares são um ponto de partida para fundos amplos. Os radiais ajudam em efeitos de iluminação localizada. Os cônicos podem servir para gráficos e detalhes menores. Teste sempre o contraste do conteúdo sobre o gradiente.
Posso usar o resultado em CSS-in-JS?
Sim. O resultado é uma string válida para a propriedade background do CSS. Atribua-a à propriedade correspondente no seu projeto: background: 'linear-gradient(135deg, #E24B4A, #3B82F6)'.
Conic-gradient funciona em todos os navegadores?
Confira a compatibilidade de conic-gradient nos navegadores atendidos pelo seu projeto e ofereça uma cor de fundo alternativa quando necessário. Faça a mesma avaliação para os demais recursos CSS usados na página.