Hinge

Das Element schwingt von seiner Oberkante aus hin und her wie ein Pendel mit abklingendem Ausschlag.

Füge bei [wo] einen „Swing“-Aufmerksamkeitseffekt hinzu.
Das Element soll wie ein hängendes Schild hin und her schwingen, zuerst weit ausholend und dann schnell abklingend.
Lass es um seine Oberkante statt um die Mitte schwingen und spiele den Effekt beim Auslösen einmal ab.

Das Element dreht sich um einen Drehpunkt und blendet dabei aus.

Füge bei [wo] eine „Rotate Out“-Ausblendanimation hinzu.
Das Element soll sich um seine Mitte drehen, etwas mehr als eine halbe Umdrehung, und dabei ausblenden: weich, zum Ende hin beschleunigend.
Entferne es erst, wenn die Drehung vorbei ist, und blende es bei reduzierter Bewegung (prefers-reduced-motion) sofort aus.

Das Element rollt nach rechts davon und blendet dabei aus.

Füge bei [wo] eine „Roll Out“-Ausblendanimation hinzu.
Das Element soll wie ein Rad nach rechts davonrollen, sich unterwegs drehen und dabei ausblenden: weich, beim Verlassen beschleunigend.
Nimm es erst aus dem Layout, wenn es weggerollt ist, und blende es bei reduzierter Bewegung (prefers-reduced-motion) sofort aus.

Das Element springt aus einem kleinen, gedrehten Zustand hervor, schießt über und pendelt sich ein wie ein Springteufel.

Füge bei [wo] eine „Jack In The Box“-Einblendanimation hinzu.
Das Element soll aus einem winzigen, schräg gestellten Zustand an seiner Unterkante verankert hochschnellen, über die Senkrechte hinaus hin und her schaukeln und sich dann einpendeln: federnd und verspielt.
Spiele sie nur einmal ab und zeige das Element bei reduzierter Bewegung (prefers-reduced-motion) ohne Animation an seinem Platz an.

Das Element schießt schräg geneigt von der Seite herein und richtet sich beim Ankommen gerade auf.

Füge bei [wo] eine „Light Speed In“-Einblendanimation hinzu (auch lightspeed in genannt).
Das Element soll schnell von der Seite hereinschießen, schräg geneigt wie in voller Fahrt, die Neigung einmal überkorrigieren und sich beim Ankommen gerade aufrichten: schnell und dramatisch, zum Ende hin abbremsend.
Verhindere eine horizontale Scrollleiste, solange es noch außerhalb des Bildschirms ist, und zeige es bei reduzierter Bewegung (prefers-reduced-motion) ohne Animation an seinem Platz an.

Das Element neigt sich und rast zur Seite davon, während es ausblendet.

Füge bei [wo] eine „Light Speed Out“-Ausblendanimation hinzu (auch lightspeed out genannt).
Das Element soll sich neigen und beim Ausblenden zur Seite davonrasen: schnell, beim Verlassen beschleunigend.
Verhindere eine horizontale Scrollleiste, wenn es über den Rand hinausläuft, und blende es bei reduzierter Bewegung (prefers-reduced-motion) sofort aus.