Zum Inhalt springen
fend-ui
Vorschau

Tabs

Reiter mit gleitendem Akzent-Unterstrich, segmentierter Schiene oder zarter Akzent-Pill. Pfeiltasten, Home und End aktivieren den nächsten erreichbaren Reiter sofort; deaktivierte Reiter werden übersprungen. Bei vielen Reitern scrollt die Liste horizontal, ohne die Seite zu verbreitern.

Varianten

Unterstrich für Hauptnavigation, segmentiert für Ansichten und Pills für Filter. Alle drei nutzen dieselbe Fokus-, Druck- und Touch-Basis.

Unterstrich

Gleitende Akzentlinie unter dem aktiven Reiter.

Segmentiert

Helle Schiene mit weißem aktivem Reiter, exakt wie die Toggle Group.

Pills

Aktiver Reiter als runde Fläche in der zarten Akzentfarbe.

Symbole und Zählmarken

icon erscheint vor dem Text und wird dekorativ ausgeblendet; badge zeigt eine kurze Zahl, die im aktiven Reiter die Akzentfläche annimmt.

Acht Personen haben Zugriff auf diesen Bereich.

Viele Reiter auf dem Handy

Zwölf Reiter passen nicht in 375 px. Die Liste scrollt horizontal mit weich auslaufenden Rändern; der aktive Reiter wird automatisch in Sichtweite gehalten, ohne die Seite zu verbreitern.

Inhalt des Reiters „Übersicht“.

Playground

Variante, Ausrichtung und Zählmarke frei kombinieren.

Start-Inhalt des Playgrounds.