Box Shadows for TailwindCSS

A curated list of box shadows for TailwindCSS. Available in JIT 🚀 and vanilla CSS.

🖱 click to copy styles & press ⌘+D to bookmark this page.

Copied! 🎉

Aesthetic

Click buttons to copy

Copied! 🎉

Demure

Click buttons to copy

Copied! 🎉

Jubilation

Click buttons to copy

Copied! 🎉

Sprightly

Click buttons to copy

Copied! 🎉

Vigorous

Click buttons to copy

Copied! 🎉

Euphonious

Click buttons to copy

Copied! 🎉

Crescendo

Click buttons to copy

Copied! 🎉

Mondegreen

Click buttons to copy

Copied! 🎉

Nimble

Click buttons to copy

Copied! 🎉

Next.js

Click buttons to copy

Copied! 🎉

Champagne

Click buttons to copy

Copied! 🎉

India

Click buttons to copy

Copied! 🎉

Warm

Click buttons to copy

Copied! 🎉

Intense

Click buttons to copy

Copied! 🎉

Subtle

Click buttons to copy

Copied! 🎉

TailwindCSS

Click buttons to copy

Copied! 🎉

Ragnarok

Click buttons to copy

Copied! 🎉

Sleek

Click buttons to copy

Copied! 🎉

Gondor

Click buttons to copy

Copied! 🎉

Studydesk

Click buttons to copy

Copied! 🎉

PurpleStamp

Click buttons to copy

Adding more, bookmark to stay updated, and maybe 👇🏻😇

Box Shadow Generator for TailwindCSS

A free tool that helps you generate box shadows for TailwindCSS (JIT) and Vanilla CSS with ease.

Add shadow to this box with the controls on the side panel. This box mimics a card box that you might have on your website.

Add shadow layers, change colors and play with the controls.

Want beautiful shadows already?

0px Horizontal Offset

20px Vertical Offset

20px blur

20px spread

Want to hire me as a freelancer? Let's discuss.

Drop your message and let's discuss about your project.

Chat on WhatsApp

Drop in your email ID and I will get back to you.