deviantART Contest Buttons

#C5B142
#63903A
#A26A27
#BAE7D7
#2F461C
#62A6A0
#5E601D
#787F80

Here's a set of buttons I styled for a contest on deviantART a while back.

CSS for the shadow effect ->
box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.4),inset 0 0 5px 0 rgba(255, 255, 255, 0.2),inset 0 67px 67px -40px rgba(255, 255, 255, 0),0 2px 0 0 #2E2E2E,0 3px 6px 0 rgba(0, 0, 0, 0.4);

&:hover ->
box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.6),inset 0 0 5px 0 rgba(255, 255, 255, 0.2),inset 0 67px 67px -40px rgba(255, 255, 255, 0.3),0 2px 0 0 #2E2E2E,0 3px 8px 0 rgba(0, 0, 0, 0.4);

&:focus, &:active ->
box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0),inset 0 1px 7px -1px rgba(0, 0, 0, 0.35),inset 0 67px 67px -40px rgba(255, 255, 255, 0),0 2px 0 0 #2E2E2E,0 3px 8px 0 rgba(0, 0, 0, 0);

Melody Get in touch

More by Melody

View profile