Gerador de Hover Effects
Efeitos de hover prontos — elevação, brilho, borda animada — para aplicar em qualquer elemento.
Propriedades CSS utilizadas
:hoverPseudo-classe que aplica estilos apenas enquanto o cursor está sobre o elemento — funciona só em dispositivos com mouse; em touch o comportamento varia por navegador.
transition no estado normalPara o efeito ser suave, a transition deve estar declarada no seletor base (estado normal), não apenas no :hover.
Perguntas frequentes
Parcialmente — alguns navegadores mobile simulam :hover no toque, mas não é um comportamento garantido. Para mobile, prefira :active ou JavaScript.
Sim, copie o CSS gerado e mescle as propriedades de transform/filter/box-shadow manualmente conforme necessário.
Sim, aplique o seletor ao elemento real (a, button) para manter a acessibilidade nativa desses elementos.
Ferramentas relacionadas
Gerador de Transitions
Configure propriedade, duração, easing e delay para transições suaves.
Gerador de Transform
Combine translate, rotate, scale e skew num único transform.
Gerador de Botões CSS
Botões com preenchimento, sombra, borda e cantos arredondados prontos para o seu design system.