ToolsRail
Home
Shadow Generator
Tailwind Font Generator
About
Home
Shadow Generator
Tailwind Font Generator
About
Home
Tailwind Tools
Tailwind CSS Shadow Generator
Create beautiful shadow effects with Tailwind CSS classes
Shadow Controls
Shadow Intensity
?
None
Small (shadow-sm)
Default (shadow)
Medium (shadow-md)
Large (shadow-lg)
Extra Large (shadow-xl)
2xl (shadow-2xl)
Shadow Color
?
Black
Gray
Slate
Zinc
Blue
Indigo
Purple
Pink
Red
Orange
Yellow
Green
Emerald
Teal
Cyan
5%
10%
20%
30%
40%
50%
60%
70%
80%
90%
100%
Inset Shadow
?
Blur Radius
?
None
Small (blur-sm)
Default (blur)
Medium (blur-md)
Large (blur-lg)
Extra Large (blur-xl)
2XL (blur-2xl)
3XL (blur-3xl)
Spread & Offset
?
X Offset
Y Offset
Blur
Spread
Use Custom Shadow
Multiple Shadows
?
Shadow 1
Remove
Inset
+ Add Shadow
Neumorphism Effect
?
Hover & Active Effects
?
Hover Shadow
None
Small
Default
Medium
Large
Extra Large
2xl
Active Shadow
None
Small
Default
Medium
Large
Extra Large
2xl
Different Dark Mode Shadow
?
None
Small
Default
Medium
Large
Extra Large
2xl
Glassmorphism Effect
?
Small Blur
Default Blur
Medium Blur
Large Blur
Extra Large Blur
2xl Blur
3xl Blur
Glowing Shadow Effect
?
Blue Glow
Purple Glow
Pink Glow
Red Glow
Orange Glow
Yellow Glow
Green Glow
Emerald Glow
Teal Glow
Cyan Glow
3D Depth Effect
?
Border + Shadow
?
Default
2px
4px
8px
Gray
Blue
Indigo
Purple
Pink
Red
Green
Live Preview
Preview Element
Toggle Dark/Light Mode
Generated Tailwind Classes
Copy Code
Copied!