HTML
CSS
JS

3D Clickable Button with CSS3

This is a CSS 3 only 3D button. The 3D effect is created using box-shadow property. When it is clicked, .press-button:active, it also uses box-shadow to reduce the bottom shadow to create the illusion of the button being pressed.

This button is ideal for web pages with any workflow that submits an API request to the backend to fetch data without refreshing the page, such as SPA. You can further customize this button by changing the font, color, and padding to create a slightly different look and feel.

';