Hey HN, I wanted to share this stylesheet for a skeuomorphic button that comes from a project I've been working on. Hope you find some interest in it
I wanted to capture some of the physicality of real buttons so I've been playing with this "soft divot" concept. It's a border style that creates an illusion of the button sitting flush on the page.
Skeuomorphic buttons have been around forever. What I think is different here is this idea of maintaining the button face on the same plane as its background.
It comes with three elevation levels: raised (+1), default (0) and sunken (-1). For primary actions you can choose the raised plane face. Then most other buttons, they can stay nicely on the default UI plane.
I wanted to capture some of the physicality of real buttons so I've been playing with this "soft divot" concept. It's a border style that creates an illusion of the button sitting flush on the page.
Skeuomorphic buttons have been around forever. What I think is different here is this idea of maintaining the button face on the same plane as its background.
It comes with three elevation levels: raised (+1), default (0) and sunken (-1). For primary actions you can choose the raised plane face. Then most other buttons, they can stay nicely on the default UI plane.
This is super cool! really love the thought placed into emulating hardware buttons