Type your text
Enter whatever headline or label you want to style.
CSS Text Shadow Generator
Build single or layered text shadows visually. Add layers for glow, emboss or 3D effects, then copy the CSS.
Shadowed
Ready-to-use CSS
How it works
Stack shadow layers
Tune offset, blur and color per layer, and add more for depth or glow.
Copy the CSS
Get a ready-to-use text-shadow declaration with every layer combined.
FAQ
Can CSS text-shadow have multiple layers?
Yes, like box-shadow, text-shadow accepts a comma-separated list of shadows, which this generator builds automatically as you add layers.
How do I make a 3D or emboss text effect?
Stack several small offset shadows in a consistent direction with slightly different shades, which is exactly what the extra layers here let you do.
Does text-shadow affect layout?
No, text-shadow is purely visual and does not change the text's box size or surrounding layout.