DEV Community 👩‍💻👨‍💻

Shubham Jadhav
Shubham Jadhav

Posted on

Neumorphic Social Media Buttons in CSS

Neumorphic Social Media Button using pure CSS 👇

Top comments (5)

Collapse
 
jonrandy profile image
Jon Randy 🎖️ • Edited on

There is an issue - by removing the outline there is no way of seeing if the button is active if you have got to it using the keyboard (tabbed to it for example). Could perhaps be solved by making the button appear in the 'down' state with :focus?

Collapse
 
kiddcreator profile image
kidd-creator

This might help though

button:active{
    transform: scale(0.89)
}
Enter fullscreen mode Exit fullscreen mode
Collapse
 
jonrandy profile image
Jon Randy 🎖️

Yeah - anything visual. Needs to be on :focus not :active though

Thread Thread
 
kiddcreator profile image
kidd-creator

okay thanks

Collapse
 
eleanorgilbert profile image
Eleanor Gilbert

Thanks, I use these Social Media Buttons

Tired of sifting through your feed?

You can change your feed and see more relevant posts by adding a rating to different tags on DEV. Head here to adjust your weights.