Sovas
UA
Web Tools
Início
Todas as ferramentas
Contacto
DE
EN
ES
PL
PT
RU
UA
Voltar aos serviços
Gerador de botões CSS PRO
Crie botões perfeitos com animações, links, espaçamentos e sombras.
Moderna
Contorno
Animação de preenchimento
Neon (Glow)
Texto, Link e Ícone
Texto do botão:
Símbolo/Ícone:
Sem ícone
Seta →
Verificação ✓
Foguete 🚀
Carrinho 🛒
Estrela ⭐
Fogo 🔥
Correio ✉
Posição:
Esquerda
Direita
Link (URL):
Numa nova janela (_blank)
Tamanho da fonte:
16
px
Espessura da fonte:
Normal (400)
Medium (500)
Semi-Bold (600)
Bold (700)
Espaçamento (Spacing)
Interno (Padding)
Cima/Baixo (Y):
12
px
Esquerda/Direita (X):
24
px
Externo (Margin)
Cima/Baixo (Y):
10
px
Esquerda/Direita (X):
0
px
Cores & Hover
Alteração de cor normal
Preenchimento da esquerda para a direita
Preenchimento de baixo para cima
Brilho de neon
Desativar efeito Hover
Estado normal
Cor de fundo
Cor do texto
Cor da borda
Ao passar o rato (Hover)
Cor de fundo (ou preenchimento)
Cor do texto
Cor da borda
Forma, Sombra e Clique
Raio dos cantos:
8
px
Espessura da borda:
0
px
Sombra (Box Shadow):
Sem sombra
Muito leve
Média (Soft)
Grande (Float)
Efeito 3D (Inferior)
Efeito ao clicar (Active):
Nenhum
Redução (Scale 0.95)
Deslocamento para baixo (Translate Y)
Pré-visualização
HTML:
Copiar
CSS:
Copiar
Copiado!
