Combinação de cores para três botões

Qual combinação de cores funcionaria melhor para esses três botões:

Todos devem permanecer da mesma cor?

Estas são as minhas opções:

Imagem da página inteira

O botão Ir deve ser maior e ter o maior contraste de todos, já que é o principal.

O botão Limpar está bom porque é uma ação secundária e deve ser neutra .

Para mim, o botão Switch tem muita presença, tanto em tamanho quanto em contraste. Eu o posicionaria entre as listas suspensas Origem-Destino, onde faz mais sentido "por si só".

Aqui estão duas soluções semelhantes que, para mim, são muito mais limpas e oferecem melhor usabilidade para esse fim específico (eu escolheria pessoalmente a primeira ):

Apenas para sua informação pessoal: usei os ícones Font-Awesom e, o da primeira imagem é (dependendo da sua versão) icon-exchange / fa-exchange e as setas são icon- arrow-left / right e fa-arrow-left / certo

EDIT - Removendo a desordem (com base no comentário de um DA01 ):

Se o botão Limpar limpar apenas esses dois campos (de / para), não parece necessário, pois os usuários terão que clicar em cada lista suspensa e fazer a seleção, e isso não será alterado se você adicionar um botão Limpar .
Se for esse o caso, recomendo removê-lo, para que você obtenha uma interface mais limpa e impeça que os usuários executem uma ação que não agregue nenhum valor a eles (além de remover acidentalmente o que eles selecionaram).

Uma solução é separar visualmente seu botão por prioridade.

Normalmente, você tem botões primários, botões secundários e, às vezes, botões terciários e / ou botões de ação não preferenciais.

Para Primário e Secundário, geralmente sugiro sua cor de marca preferida (puramente subjetiva) em dois níveis de contraste. Alto contraste para primário, ligeiramente menos contraste para secundário.

Botões terciários Eu geralmente tento evitar e, em vez disso, escolho um visual completamente diferente, como um link.

Portanto, dado o seu exemplo e interpretando o contexto da maneira que eu puder, sugiro algo como isto:

Esse é apenas um exemplo muito rápido e você precisa confirmar que o contraste atende às diretrizes de acessibilidade e não parece desabilitado (o que o meu meio faz, por isso precisa ser aprimorado), mas espero que entenda isso.

ATUALIZAÇÃO: Acabei de notar que, ao publicar isso, esse é o padrão que o StackExchange usa ao criar uma nova postagem. O botão SALVAR é primário, o CANCELAR é terciário e mostrado como um link e não como um botão.

Cores com alto contraste (por exemplo, preto e branco) são sempre as melhores, o que elimina a opção laranja. E então, adicionando um pouco de marketing à mistura, qual é o esquema de cores usado para o restante da sua página em termos de botões, aplicativo? Mas se eu tivesse que escolher: Vá: verde; Switch ...: azul marinho; Claro: preto e branco. Lembre-se de que a cor também está relacionada à preferência.

(Fora do tópico: você pode eliminar o rótulo longo para alternar com um botão marcado com o ícone entre os dois campos)

Eu diria que mude o contraste de um tom de cor semelhante para mostrar ênfase . Por quê? ( 1 em 12 homens são daltônicos e 1 em 200 mulheres também são daltônicos

Você também deseja orientar os usuários na direção do caminho pretendido pelo sistema, para que o botão Ir fique mais escuro. Eles podiam digitalizar todos os botões e processá-los, ou poderiam ter algo como uma cor mais escura ou tamanho maior que os atraísse para a escolha pretendida ou 80% mais comum, da maneira como eles olham para lá primeiro e dizem que sim, economizando tempo.

Este artigo diz que aquele deve fazer com que o botão mais importante se pareça com esse

Veja o exemplo deles abaixo

Não parece tão bom quanto a imagem abaixo (na minha opinião)

Esse artigo também menciona Para colocar botões em uma ordem sensata . Então, na minha opinião, eu colocaria o botão ir à direita, porque os usuários que falam inglês da esquerda para a direita (então eles naturalmente olham para a direita para encontrar sinais finais). Eu colocaria à esquerda para usuários árabes. É assim que eu organizaria para um mercado inglês.

Um último tópico desse artigo é Tornar mais difícil encontrar botões destrutivos. No seu cenário, eu mudaria seu pedido dessa maneira se você clicar em Ir e acidentalmente errar para a esquerda, você possivelmente mudaria o local de envio em vez de destruir a ação. Além disso, você pode confirmar a tarefa destrutiva se achar necessário (ou seja, tem certeza?).