Flip In

El elemento da una vuelta completa sobre el eje Y mientras se acerca un poco al espectador y vuelve.

Añade una animación "Flip" en [dónde].
El elemento debe dar una vuelta completa sobre su eje vertical mientras se acerca un poco al espectador, y luego volver con una leve reducción de tamaño: vivo pero breve.
Dale perspectiva para que el giro se lea como profundidad, reprodúcela una sola vez en lugar de en bucle, y omite el giro si el usuario prefiere movimiento reducido (prefers-reduced-motion).

Una tarjeta gira media vuelta sobre un eje para mostrar su cara trasera.

Añade un efecto "Card Flip" (también llamado flip card o card flip 3D) en [dónde].
Cuando el cursor esté sobre la tarjeta, debe darse la vuelta en perspectiva sobre su eje vertical para mostrar su cara trasera, y volver cuando el cursor sale: suave y constante.
Oculta la parte de atrás de cada cara para que nunca se transparenten entre sí, y haz que el giro funcione con el foco del teclado y con un toque en pantallas táctiles.

El elemento gira en 3D hasta quedar de canto e invisible.

Añade una animación de salida "Flip Out" (también llamada flip out X o flip out Y) en [dónde].
El elemento debe inclinarse un poco hacia atrás y luego girar sobre su eje vertical hasta quedar de canto y desaparecer: rápido y nítido.
Dale perspectiva para que el giro se lea como profundidad, quita el elemento solo cuando termine el giro, y ocúltalo al instante si el usuario prefiere movimiento reducido (prefers-reduced-motion).

Las letras o palabras giran en 3D sobre un eje para mostrar el siguiente texto en su cara trasera.

Añade un efecto hover "Text 3D Flip" (también llamado 3D flip text reveal) en [dónde].
Cuando el puntero esté sobre el texto, cada letra debe girar en 3D sobre su eje horizontal para mostrar una letra nueva en su otra cara, una tras otra en un barrido rápido y suave, y volver cuando el puntero salga.
Mantén el mismo tamaño de la caja de texto durante el giro y muestra el mismo efecto con el foco del teclado.

El elemento gira sobre una bisagra en la esquina superior izquierda, se balancea y luego cae fuera de la pantalla.

Añade una animación de salida "Hinge" en [dónde].
El elemento debe descolgarse desde su esquina superior izquierda como si se hubiera soltado un tornillo, balancearse de un lado a otro y luego caer fuera de la pantalla mientras desaparece: lento, cómico y deliberado.
Deja que caiga por encima del resto del contenido sin empujar el diseño ni añadir barras de desplazamiento, quítalo cuando haya caído, y ocúltalo al instante si el usuario prefiere movimiento reducido (prefers-reduced-motion).

El elemento surge desde un estado pequeño y girado, se pasa y se asienta como un muñeco sorpresa de resorte.

Añade una animación de entrada "Jack In The Box" en [dónde].
El elemento debe surgir desde un estado diminuto e inclinado, anclado en su borde inferior, balancearse de lado a lado pasando de la vertical y asentarse: elástico y divertido.
Reprodúcela una sola vez y muestra el elemento en su lugar sin movimiento si el usuario prefiere movimiento reducido (prefers-reduced-motion).