Created attachment 11764
Screenshot of current and example of possible new button styles

Attached:

note to self how to reproduce:

Check Special:Preferences, section "editing":

• "Enable enhanced editing toolbar" enabled
• "Enable dialogs for inserting links, tables and more" enabled

Also as I understand this bug is about Vector skin only, so one needs
to have Vector to see the buttons.

I generally think that shadows and gradients contribute to poorer contrast, worse readability and in the end lead to usability issues with users that don't have very sharp eyes or something.

To the contrary, I love the suggested styles. They're neat and simple, the gradients are subtle, and it looks like they would work equally well without the shadow (and would be readable without the gradient as well).

The blue on the default button in current style is plain awful, and the outlines of the buttons cause them to "blur" visually. The background gradient of the default button is also pretty aggressive, it looks like a metal pipe.

Shadows and gradients can indeed contribute to poorer contrast and readability and often do, but the same could be said of any use of colour or space. The key is to take care with these things regardless of which particular effects are employed, which I have tried to do here.

Just to mention it: Bug 37743 - jQuery color button classes (ui-button-blue, ...) don't show focus and active state properly

What happens if I put this here?

I6f28ce6c9c3403d8377b4b3aaa7495b01853ee0e

https://gerrit.wikimedia.org/r/54228 (Gerrit Change I6f28ce6c9c3403d8377b4b3aaa7495b01853ee0e) | change APPROVED and MERGED [by Trevor Parscal]

I guess that makes it RESOLVED FIXED.