Tooltip auf Kreisbahn
Ein Tooltip, der auf einem kleinen Bogen hereinschwingt und sich über dem Icon niederlässt, als hätte ihn jemand dorthin geworfen.
Einstellungen
Code
<button class="uv-to">♡<span>Zu Favoriten hinzufügen</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
Buttons, die nur aus einem Icon bestehen, brauchen ein Label, und dieses hat Charakter. Stell dir das Herz auf einem Immobilienportal vor: Du fährst mit der Maus darüber, und „Zu Favoriten hinzufügen“ schwingt nach oben an seinen Platz. Der animierte Tooltip in HTML und CSS erscheint auch beim Tastaturfokus.
Lass über dem Button etwas Platz, denn der Bogen startet seitlich und wird in engen Containern schnell abgeschnitten. Am besten wirkt er bei einzelnen Icons mit Luft drumherum. In einer vollen Werkzeugleiste ist ein ruhigerer Tooltip die bessere Wahl.