Estou criando botões há um tempo, mas quando se trata de selecionar as cores para o estado de foco de um gradiente ou sólido, tem sido principalmente uma questão de observar um tom mais escuro.
Existe uma teoria estruturada das cores por aí que ajudaria a julgar melhor qual seria o tom mais apropriado para usar?
Quão escuro devo ficar do original?
Como posso definir tons mais claros ou mais escuros da "mesma" cor?
website-design
color
button
Carl Edwards
fonte
fonte
Respostas:
Ao procurar uma ligeira mudança na leveza, costumo fazer as contas - na verdade, é simples contar.
O formato hexadecimal para cores é
RRGGBB
vermelho, verde e azul. O hexadecimal é contado de 0-F (então, depois de 9, vem A).Se eu tiver
#191970
como cor do botão principal, adicionarei 1 ou 2 a cada valor de cor, resultando em uma cor semelhante, porém mais clara. Adicionar 1 a cada um resultaria em#1A1A71
.O mesmo poderia ser feito para encontrar uma sombra mais escura. Subtrair 1 de cada valor de cor
#191970
resultaria em#18186F
.No entanto, adicionar ou subtrair 1 ou 2 de cada valor de cor provavelmente resultará em uma diferença indistinguível; portanto, você provavelmente precisará adicionar ou subtrair pelo menos 10 de cada.
Se você estiver usando o formato numérico
(255, 255, 255)
, basta adicionar a cada número usando as operações normais da base 10.A adição da mesma quantidade a cada valor de cor garante que o matiz e a saturação permaneçam consistentes e as cores resultantes se misturam harmoniosamente em um design.
fonte
Ou então, você pode deixar algum gerador on-line fazer as opções de cores para você e apenas usar o código que você precisa: Gradiente CSS O botão é apenas um exemplo.
fonte