Crie um belo gradiente de texto CSS sem esforço
Crie efeitos de texto gradiente impressionantes para o seu site
Controles de gradiente
.gradient-text { background: linear-gradient(to right, #4F46E5, #EC4899); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
Gradientes populares
Modo de Utilização
Digite seu texto
Digite o texto ao qual deseja aplicar o gradiente no campo de entrada "Texto".
Escolha o tipo de gradiente
Selecione entre os tipos de gradiente Linear, Radial ou Cônico.
Ajustar direção ou ângulo
Para gradientes lineares, escolha uma direção. Para gradientes cônicos, defina o ângulo.
Personalizar cores
Adicione, remova ou ajuste as paradas de cor e suas posições para criar o gradiente desejado.
Copiar ou salvar CSS
Copie o código CSS gerado ou salve-o como um arquivo CSS para usar em seus projetos.
Sobre gradientes de texto
Os gradientes de texto CSS permitem que você aplique gradientes bonitos e multicoloridos diretamente ao texto. Esse efeito já foi possível apenas com imagens, mas o CSS moderno o torna simples e eficiente.
Suporte ao navegador:Os gradientes de texto são compatíveis com todos os navegadores modernos, incluindo Chrome, Firefox, Safari e Edge. Para navegadores mais antigos, como o Internet Explorer, o texto voltará a uma cor sólida.
Dicas de uso:Os gradientes de texto funcionam melhor com texto em negrito e combinações de cores de alto contraste. Experimente diferentes tipos e direções de gradiente para obter o efeito desejado.
Related Tools
Gerador de transição CSS3
Transição suave de opacidade
Conversor de Sass para CSS
Transforme seu código Sass em CSS. Rápido, fácil e seguro.
Minificador CSS
Comprima e otimize seu código CSS com precisão profissional
HEX para RGB
Converter códigos de cores HEX em valores RGB para desenvolvimento web
CMYK para RGB
Converta valores de cores CMYK em RGB para aplicações digitais
Conversor de iluminância
Converta a iluminância entre diferentes unidades com precisão