Flash
Auch genannt Blink
Das Element blinkt, indem es seine Deckkraft schnell wechselt.
Einsatz
Hinweis auf neue Inhalte
Prompt
Ersetze [wo] durch die Stelle auf deiner Seite und füge den Prompt in deinen KI-Agenten ein. Jeder Prompt enthält den Namen der Animation – beim nächsten Mal reicht es, sie beim Namen zu nennen.
Füge bei [wo] einen „Flash“-Aufmerksamkeitseffekt hinzu (auch blink genannt).
Das Element soll zweimal schnell aus- und wieder einblenden und danach voll sichtbar bleiben.
Spiele ihn nur einmal ab statt als endloses Blinken, und lass ihn bei reduzierter Bewegung weg, weil schnelles Blinken unangenehm sein kann.Ähnliche Animationen
ABC
Flicker
Auch genannt Flickering
Die Deckkraft des Elements flackert unregelmäßig wie eine defekte Lampe.
Einsatz
Neon- und Glitch-Effekte
Füge bei [wo] einen „Flicker“-Effekt hinzu (auch flickering genannt).
Das Element soll die meiste Zeit ruhig bleiben und in kurzen, unregelmäßigen Aussetzern dunkler werden wie eine defekte Neonröhre.
Halte das Timing unregelmäßig statt gleichmäßig, vermeide schnelles Blitzen in voller Stärke und stoppe ihn bei reduzierter Bewegung.ABCD
Das Element flackert mit schnellen Deckkraftwechseln auf wie eine defekte Leuchtreklame, bevor es sichtbar bleibt.
Einsatz
Neon- und Retro-Texteffekte
Füge bei [wo] eine „Flicker In“-Einblendanimation hinzu.
Das Element soll in unregelmäßigen Abständen ein paarmal an- und ausgehen wie eine defekte Leuchtreklame, bevor es dauerhaft leuchtet: harte Blitze ohne Bewegung.
Spiele sie nur einmal ab, halte die Blitze wenige und langsam genug, damit sie für lichtempfindliche Menschen unbedenklich sind, und zeige das Element bei reduzierter Bewegung (prefers-reduced-motion) ruhig leuchtend an.A
Pulse
Auch genannt Pulsing
Das Element skaliert oder blendet sanft und wiederholt ein und aus.
Einsatz
Skeleton-Loader, Live-Anzeigen, CTAs
Füge bei [wo] einen „Pulse“-Effekt hinzu (auch pulsing genannt).
Das Element soll in einem langsamen, gleichmäßigen Rhythmus sanft anschwellen und wieder zurückgehen: dezent, ohne Nachfedern.
Lass ihn nahtlos in Schleife laufen, ohne das umliegende Layout zu verschieben, und stoppe ihn bei reduzierter Bewegung (prefers-reduced-motion).ABCDEF
Neon Glow Text
Auch genannt Neon Sign Flicker, Glowing Text
Der Text leuchtet wie eine Neonröhre und flackert oder pulsiert.
Einsatz
Nachtleben- und Gaming-Themen
Füge bei [wo] einen „Neon Glow Text“-Effekt hinzu (auch neon sign flicker oder glowing text genannt).
Der Text soll wie eine Neonröhre mit weichem, gleichmäßigem Licht leuchten und hin und wieder kurz ausflackern wie ein echtes Leuchtschild.
Lass das Flackern nur gelegentlich und nicht schnell auftreten, weil schnelles Blinken manchen Menschen schaden kann, und halte das Leuchten bei reduzierter Bewegung (prefers-reduced-motion) konstant.Mehr aus Emphasis
A
Head Shake
Auch genannt Headshake, No Shake
Das Element pendelt mit leichter Drehung hin und her wie ein verneinendes Kopfschütteln.
Einsatz
Ungültige Eingaben oder Ablehnungen
Füge bei [wo] einen „Head Shake“-Aufmerksamkeitseffekt hinzu (auch headshake oder no shake genannt).
Das Element soll sich schnell mit einer leichten Drehung hin und her wenden wie ein verneinendes Kopfschütteln, jede Bewegung kleiner als die vorige, bis es zur Ruhe kommt.
Spiele ihn bei jedem Auslösen einmal ab, etwa bei einer abgelehnten Aktion, und sorge dafür, dass sich das umliegende Layout nicht bewegt.A
Heartbeat
Auch genannt Heart Beat
Das Element pulsiert im Doppelschlag-Rhythmus wie ein schlagendes Herz.
Einsatz
Like- und Favoriten-Icons, Live-Anzeigen
Füge bei [wo] einen „Heartbeat“-Effekt hinzu (auch heart beat genannt).
Das Element soll in einem schnellen Doppelschlag anschwellen und wieder entspannen und vor dem nächsten Schlag kurz ruhen, wie ein schlagendes Herz.
Lass ihn nahtlos in Schleife laufen, mit der Pause zwischen den Schlägen, und stoppe ihn bei reduzierter Bewegung (prefers-reduced-motion).