Generate CSS text shadows and glow effects with a live preview. Adjust offset, blur and color, then copy the CSS code. Free text shadow generator.
About this tool
Preview a text shadow or glow with adjustable offsets, blur and color.
How to use CSS Text Shadow Generator
- Enter Preview text and choose Font size.
- Set offsets, Blur and Shadow opacity, then choose shadow, text and background colors.
- Copy the CSS and inspect it with the font used on your website.
Worked example
Set offsets near zero with a blurred colored shadow to explore a glow effect.
Does a glow replace adequate contrast?
No. Text should remain readable without relying on a decorative halo.
Will the shadow look identical with another font?
Letter shapes and weights affect its appearance. Test with the final font and size.
Explore CSS Tools · More practical guides