Shine

The only images here are the icons and the yellow stripey background. I thought I had done something terribly clever to create rounded reflections with an offset element and rgba, and even a bit of box-shadow to make the edge slightly blurry. However, the hidden overflow thinks the button is square and doesn't clip the corners of the offset reflection. It looks passable on a white background, but falls apart on a color. So it's not gonna work after all. I think I'll just have to stick with a background image and no rounded reflections. Boo.

But I'm totally keeping this technique in my back pocket in case it comes up again. If the background is white and the button doesn't have a dark border, it looks pretty slick. It does require an empty presentational element (I used <b></b>), but that could be injected with JavaScript.