Tabs mit mitlaufender Pille
Eine sanfte Pille folgt dem Cursor über die Tabs und kehrt zum aktiven zurück, wenn du die Leiste verlässt.
Einstellungen
Code
<div class="uv-ftf"><span class="p"></span><button class="on">Beliebt</button><button>Neu</button><button>In der Nähe</button><button>Top</button></div>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 Filter
Wofür du ihn nutzen kannst
Passt gut zu Desktop-Seiten, auf denen Leute erst stöbern und dann entscheiden. Etwa eine Veranstaltungsseite mit Beliebt, Neu, In der Nähe und Top der Woche, oder ein Marktplatz für Templates. Die Pille zeigt vorab, wo ein Klick landen würde, und die Leiste wirkt dadurch lebendig. Oft gesucht als Hover-Tabs oder Magic-Line-Navigation.
Auf Touchscreens gibt es kein Hover, die Pille springt dort einfach zum angetippten Tab. Das ist in Ordnung, aber für eine Mobile-first-App solltest du nicht auf den Effekt setzen. Halte die Tönung hell, sie soll andeuten, nicht hervorheben.