Komponenten

Chips and Tags

Chips sind minimalistische Elemente, die als Statusanzeige dienen oder Eingaben eines Nutzers widerspiegeln. Sie kommen beispielsweise beim Setzen von Filtern zum Einsatz. Mit Tags können Sie bestimmte Elemente, z. B. Artikel, mit einem Label versehen oder einer Kategorie zuweisen und so das Filtern der Inhalte ermöglichen. Wie Sie Chips und Tags anwenden, erfahren Sie in diesem Guide.

Chips and Tags
  • Anwendung
  • Beispiele
  • Verwandte Komponente
  • Download

Anwendung

Chips

Chips treten in Formularfeldern – insbesondere in Suchfeldern – auf und indizieren gefilterte Inhalte. Durch die Texteingabe des Nutzers können Chips verändert werden. Durch einen Klick auf das x lassen sie sich vollständig löschen.

Tags

Tags werden als einfacher Text in einer abgerundeten Box dargestellt und können bei Bedarf interaktiv sein. Sie treten in zwei verschiedenen Zuständen auf: Default oder disabled. Disabled Tags können nicht angeklickt werden.

Chip Layouts

Für das Design der Chips stehen verschiedene Möglichkeiten zur Auswahl: mit Icon links oder rechts vom Text, als Toggle-Buttons oder mit Bild vor dem Text. Bei längeren Inhalten darf sich der Text über mehrere Zeilen erstrecken.

Beispiele

Verwandte Komponente

Download

Wenn Sie ein Dokument herunterladen, akzeptieren Sie unsere Nutzungsbedingungen.

Sketch UI Library