Background Fade

Eine durchscheinende Überlagerung tönt das Element und zeigt so, dass der Zeiger darüber ist.

Füge bei [wo] einen „Hover State Layer“ hinzu (auch hover state, state layer oder hover overlay genannt).
Eine schwache, durchscheinende Überlagerung in der Inhaltsfarbe soll schnell über dem Element einblenden, solange der Zeiger darüber ist, und beim Verlassen ausblenden.
Halte sie schwach, damit der Kontrast erhalten bleibt, und nutze denselben Layer-Ansatz für Fokus- und gedrückte Zustände.

Die Rahmenfarbe blendet beim Hovern ein oder wechselt weich.

Füge bei [wo] einen „Border Fade“-Hover-Effekt hinzu.
Der Rahmen soll weich von einem gedämpften Ton in die Akzentfarbe überblenden, solange der Zeiger über dem Element ist: dezent, ohne Bewegung oder Größenänderung.
Lass die Rahmenbreite in beiden Zuständen gleich, damit nichts verrutscht, und zeige denselben Effekt beim Tastaturfokus.

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 leert sich der gefüllte Hintergrund, sodass nur ein umrandeter Button bleibt.

Füge bei [wo] einen „Hollow“-Hover-Effekt hinzu (auch ghost fill genannt).
Der gefüllte Hintergrund soll ausblenden, sodass nur die Kontur bleibt, und die Beschriftung soll die Farbe wechseln, damit sie auf dem leeren Hintergrund lesbar bleibt: weich und schnell.
Halte die Rahmenstärke in beiden Zuständen gleich, damit sich die Größe des Elements nicht ändert, 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.