These buttons are pure HTML/CSS and use blend modes (like Overlay) from Photoshop. Using SASS, one color gets passed in and all the effects come from that color. The button is also built to handle lighter button colors, reversing the color of the icon and adjusting the effects.
The icon comes from the amazing, semantic Symbolset font. Check it out if you haven't already.
I built this because so many buttons look muddied when you just combine a base color with black or white. These buttons are pulling styles directly from the Layer Styles palette in Photoshop so colors remain pure and vibrant.
So, what do you think?
L or F like
Show and tell for designers
What are you working on? Dribbble is a community of designers sharing screenshots of their work, process, and projects.
We’re Tiny along with
We Work Remotely and more.
© 2018 Dribbble. All rights reserved.
A community of designers sharing their work, process, and current projects.
Minimum 6 characters
Uh oh… We’re still waiting for our spam prevention code to load.
Already a member? Sign in