Tooltip mit Lichtschimmer
Das Label gleitet an seinen Platz, während ein Lichtstreifen einmal quer darüber wandert.
Einstellungen
Code
<button class="uv-tw">Synchronisieren<span>Synchronisierung aktiv<i></i></span></button>Prompt für KI
Füg ihn in ChatGPT, Claude oder Cursor ein und der Baustein wird mit diesen Einstellungen an dein Projekt angepasst, auch ohne React.
Mehr aus Tooltips
Wofür du ihn nutzen kannst
Der durchlaufende Lichtstreifen signalisiert, dass sich gerade etwas tut. Deshalb passt er gut zu Aktionen wie Synchronisieren oder Aktualisieren, etwa beim Button „Jetzt synchronisieren“ in einer Fitness-App, die Trainings von der Uhr holt, oder beim Backup-Icon eines Fotodienstes. Ein kleiner Tooltip mit Schimmer-Effekt in HTML und CSS.
Der Schimmer übernimmt den Ton deiner zweiten Farbe, ein zarter Farbton wirkt deshalb besser als Neon. Er läuft pro Hover einmal durch, nicht in Dauerschleife. Dauert die Synchronisierung wirklich länger, gehört zusätzlich eine Fortschrittsanzeige dazu.