3D Pin

Um card gira em perspectiva em direção ao ponteiro, com o conteúdo em camadas se destacando da superfície.

Adicione um efeito "3D Tilt" (também chamado perspective tilt ou tilt card) em [onde].
O card deve se inclinar em perspectiva em direção ao ponteiro enquanto ele se move, com as camadas internas se destacando da superfície em profundidades diferentes, e voltar a ficar plano suavemente quando o ponteiro sai: suave e sutil.
Mantenha a inclinação leve para o texto continuar legível e deixe o card plano em telas touch e se o usuário preferir movimento reduzido (prefers-reduced-motion).

Um brilho intenso segue o ponteiro pela superfície de um card como um reflexo.

Adicione um efeito "Glare / Holographic Card" (também chamado glare card ou glare hover) em [onde].
Um brilho suave e intenso deve seguir o ponteiro pela superfície do card como luz refletida nele, enquanto o card se inclina um pouco em direção ao ponteiro; os dois somem quando o ponteiro sai: suave e sutil.
Deixe os cliques passarem pela camada do brilho, mantenha o conteúdo legível por baixo e mostre o card sem brilho em telas touch.

Um card dá meia-volta em torno de um eixo para revelar o verso.

Adicione um efeito "Card Flip" (também chamado flip card ou card flip 3D) em [onde].
Quando o ponteiro estiver sobre o card, ele deve virar em perspectiva em torno do eixo vertical para mostrar o verso, e voltar quando o ponteiro sai: suave e constante.
Esconda o lado de trás de cada face para que uma nunca apareça através da outra, e faça o giro funcionar no foco do teclado e com um toque em telas touch.

Os cards se empilham com pequenos deslocamentos e o de cima se afasta para revelar o próximo.

Adicione um "Card Stack" (também chamado stacked cards) em [onde].
Empilhe os cards com pequenos deslocamentos, um atrás do outro; cada clique deve afastar o card de cima para o lado e colocá-lo no fundo enquanto os outros avançam: suave, leve e rápido.
Faça funcionar pelo teclado, deixe os leitores de tela chegarem a cada card em ordem e use um fade simples se o usuário preferir movimento reduzido (prefers-reduced-motion).