Dock Magnification

O elemento aumenta um pouco, de forma suave, quando o ponteiro está sobre ele.

Adicione um efeito de hover "Grow" (também chamado scale up) em [onde].
O elemento deve aumentar um pouco, de forma suave, enquanto o ponteiro estiver sobre ele, e voltar ao tamanho quando sair: rápido e sutil.
Evite que o layout ao redor se desloque e mostre o mesmo efeito no foco do teclado.

O elemento é puxado em direção ao ponteiro quando ele se aproxima e volta ao lugar quando ele se afasta.

Adicione um efeito "Magnetic Button" (também chamado magnetic target ou magnetic hover) em [onde].
Quando o ponteiro se aproximar, o botão deve ser puxado um pouco em direção a ele, com o texto se movendo um pouco mais, e quando o ponteiro sair ele deve voltar ao lugar com um pequeno quique elástico.
Não deixe o layout ao redor se mexer, e desative a atração em dispositivos de toque e se o usuário preferir movimento reduzido (prefers-reduced-motion).

Uma imagem aumenta dentro da moldura ao passar o ponteiro, às vezes se deslocando com ele.

Adicione um efeito "Hover Zoom" (também chamado image zoom on hover ou zoom-pan) em [onde].
Enquanto o ponteiro estiver sobre a imagem, ela deve aumentar lenta e suavemente dentro da moldura, que mantém o tamanho, e voltar suavemente quando o ponteiro sai.
Recorte a imagem na moldura para nada vazar do layout e mostre o mesmo zoom no foco do teclado.

O elemento sobe alguns pixels ao passar o mouse, como se estivesse flutuando.

Adicione um efeito de hover "Float" (também chamado lift ou raise) em [onde].
O elemento deve subir um pouco e ficar elevado enquanto o ponteiro estiver sobre ele, e voltar ao lugar quando sair: suave e delicado, sem quique.
Mova-o só visualmente, sem deslocar o layout ao redor, e mostre o mesmo efeito no foco do teclado.

Os cards vizinhos ficam desfocados e escurecidos enquanto o card sob o mouse continua nítido.

Adicione um efeito "Focus Cards" (também chamado blur siblings on hover, hover focus blur ou card hover effect) em [onde].
Enquanto o ponteiro estiver sobre um card, os outros devem desfocar, escurecer e encolher um pouco enquanto o card sob o ponteiro continua nítido, tudo com uma transição suave que se desfaz quando o ponteiro sai.
Aplique o mesmo destaque no foco do teclado e mantenha todos os cards nítidos e legíveis quando nenhum estiver sob o ponteiro.

Um halo de luz colorida aparece ao redor do elemento ao passar o mouse.

Adicione um efeito de hover "Glow" (também chamado neon glow) em [onde].
Um halo colorido suave deve surgir ao redor do elemento enquanto o ponteiro estiver sobre ele e sumir quando sair: delicado, sem movimento.
Não deixe o halo afetar o layout e mostre o mesmo efeito no foco do teclado.