DEV Community

Brandon Weaver
Brandon Weaver

Posted on

1 1

A Simple Trick for Creating 3D-Style Buttons with CSS

This week, I wanted to revisit CSS and focus a little more on styling than I usually would. During this time, I focused on button styles, and I worked on a few ideas I've had for a while now; there's one in particular which I think turned out really nice.

I used a couple of box shadows to create the illusion of a three-dimensional button, and I think that the result is great. The only downside is that the inset shadow needs to be manually set, rather than transparent/translucent to match the background of the container.

Top comments (0)

AWS Security LIVE!

Join us for AWS Security LIVE!

Discover the future of cloud security. Tune in live for trends, tips, and solutions from AWS and AWS Partners.

Learn More

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay