Componentização - Botões

Variações Posiveis para Botões


  • -Largura
  • -Altura
  • -Familia da Fonte
  • -Peso da Fonte
  • -Cor do Texo
  • -Largura da Borda
  • -Cor da Borda
  • -Cor da Borda - Hover
  • -Border Radius
  • -Tipo de transição
  • -Tempo de Transição

Exemplo de Botão: Backgroud: red, 150px por 40px,
borda 1px gray, border-radius:5px, transição:2s;

Botões - Tamanhos

Botões - Tipografia







Botões - Bordas

  • Groove - Entalhada

  • Ridge - Alto Relevo

  • Inset - Pressionda por dentro

  • Outset - Parece Levantada

  • None - Sem Bordas

  • Solid - Linha Cheia

  • Dashed - Tracejada

  • Dotted - Pontilhada

  • Double - Paralela

Botões - Border Radius

Componentização - Botões - Padronização

Botões - Botões Padrões - Padrão

Botões - Botões Padrões - Padrão - Negativo

Botões - Botões Padrões - Quadrado

Botões - Botões Padrões - Quadrado - Negativo

Botões - Botões Padrões - Redondos

Botões - Botões Padrões - Redondos - Negativo