CSS Text Shadow: Efeitos, Neon e Truques Tipográficos
Domine a sintaxe text-shadow, brilho neon, efeitos de relevo e texto legível em imagens.
CSS text-shadow adiciona profundidade, brilho e dimensão à tipografia. Diferente do box-shadow, text-shadow segue a forma dos caracteres individuais.
Múltiplas sombras sobrepostas criam os efeitos text-shadow mais impressionantes.
Sintaxe text-shadow
A sintaxe text-shadow é: text-shadow: offset-x offset-y blur-radius color. Diferente do box-shadow, não há spread-radius e nenhuma palavra-chave inset.
Ferramenta gratuita Gerador de Text Shadow Crie efeitos de brilho neon, relevo e sombras de texto criativasSombras de texto múltiplas
Múltiplos valores text-shadow criam efeitos tipográficos ricos. Técnica para profundidade: três sombras com a mesma cor mas diferentes valores de desfoque.
Efeito de brilho neon
Texto neon usa sombras sobrepostas com desfoque crescente. Receita típica: primeira sombra 0 0 7px com a cor de brilho, segunda 0 0 10px, terceira 0 0 21px, quarta 0 0 42px.
Ferramenta gratuita Gerador de Gradiente de Texto Crie efeitos de texto gradiente coloridos com CSSEfeitos emboss e deboss
Efeito emboss (texto em relevo): duas sombras — sombra escura abaixo e à direita, sombra clara acima e à esquerda. Deboss: inverter as posições das sombras.
Texto legível em imagens
text-shadow com alto desfoque e cor escura cria um halo suave: text-shadow: 0 0 20px rgba(0,0,0,0.8), 0 0 40px rgba(0,0,0,0.6).
Exemplos tipográficos criativos
Texto 3D: sobreponha 10-20 sombras idênticas deslocadas 1px na mesma direção. Impressão retro: sombra dura deslocada 1-2px em cor contrastante.
Ferramenta gratuita Gerador de Escala Tipográfica Gere uma escala tipográfica harmoniosa para seu sistema de design