Colour combination for three buttons

What colour combination would work best for these three buttons:

enter image description here

Should all of them remain the same colour?

These are my options:

enter image description here

Image of the whole page

enter image description here

Answer

The Go button should be bigger and have the highest contrast of all since it’s the primary one.

The Clear button is okay because it’s a secondary action and it should be neutral.

For me the Switch button has too much presence both in size and constrast.
I’d position it between the Origin-Destination dropdowns, where it make more sense “by itself”.

Here two similar solutions that for me are much cleaner and offer better usability for this specific purpose (I’d personally choose the first):

enter image description here

Removing the clutter :

If the Clear button will clear only those two fields (from/to) it doesn’t seem to be necessary because anyway users will have to click on each dropdown and make the selection and this doesn’t change if you add a Clear button.
If this is the case I’ll recommend to remove it, so you get a cleaner interface and prevent users to perform an action which doesn’t add any value for them (and moreover unintentionally remove what they’ve selected).

enter image description here

Attribution
Source : Link , Question Author : methuselah , Answer Author : Alejandro Veltri

Leave a Comment