Background Bounce Sweep

Ein farbiger Hintergrund wischt beim Hovern von einer Kante aus über das Element.

Füge bei [wo] einen „Background Sweep“-Hover-Effekt hinzu (auch background fill oder slide fill genannt).
Eine neue Hintergrundfarbe soll von der linken zur rechten Kante darüberwischen, weich und schnell, ohne Nachfedern, und sich beim Verlassen genauso zurückziehen, während die Textfarbe wechselt, damit alles lesbar bleibt.
Beschneide die Füllung auf die Form des Elements und zeige denselben Effekt beim Tastaturfokus.

Beim Hovern dehnt sich ein Rechteck im Element aus oder zieht sich zusammen und ändert so den Hintergrund.

Füge bei [wo] einen „Rectangle Fill“-Hover-Effekt hinzu.
Die neue Hintergrundfarbe soll sich von allen vier Kanten her schließen, während ein inneres Rechteck zur Mitte schrumpft, und sich beim Verlassen des Zeigers wieder öffnen, während die Beschriftung die Farbe wechselt, um lesbar zu bleiben: weich und schnell.
Halte die Beschriftung über der Füllung und zeige denselben Effekt beim Tastaturfokus.

Beim Hovern öffnet oder schließt sich der Hintergrund wie Fensterläden von der Mitte oder von den Rändern aus.

Füge bei [wo] einen „Shutter Fill“-Hover-Effekt hinzu (auch shutter genannt).
Die neue Hintergrundfarbe soll sich von einer senkrechten Linie in der Mitte wie Fensterläden zu beiden Seiten öffnen und sich beim Verlassen wieder zur Mitte schließen, während die Schriftfarbe wechselt, damit der Text lesbar bleibt: weich und schnell.
Schneide die Füllung am Rand des Elements ab, halte den Text darüber und zeige denselben Effekt beim Tastaturfokus.

Hintergrund- und Textfarbe blenden beim Hovern weich in eine neue Farbe über.

Füge bei [wo] einen „Background Fade“-Hover-Effekt hinzu (auch color fade genannt).
Hintergrund- und Textfarbe sollen weich in neue Farben überblenden, solange der Zeiger über dem Element ist, und beim Verlassen zurückblenden: ruhig, ohne Bewegung.
Achte in beiden Zuständen auf genug Kontrast zwischen Text und Hintergrund und zeige denselben Effekt beim Tastaturfokus.

Das Element schwebt nach oben und wippt dann beim Hovern fortlaufend auf und ab.

Füge bei [wo] einen „Bob“-Hover-Effekt hinzu (auch hang genannt).
Das Element soll ein Stück nach oben schweben und dann sanft auf und ab wippen, solange der Zeiger darüber bleibt, und beim Verlassen wieder absinken: langsam und weich.
Lass das Wippen nur beim Hovern laufen und halte das Element bei reduzierter Bewegung (prefers-reduced-motion) still.