Buttons
20 VariantsButtons, Groups und Toggles.
Die kleinen Teile. Buttons, Inputs, Cards, Overlays, Charts und Effects.
22 Kategorien · 112 Components · 373 Variants
Elements sind die Bausteine in jeder Section, Buttons, Eingabefelder, Selects, Datumsauswahl, Cards, Dialoge, Tooltips, Tabs, Tabellen, Diagramme und Mediaplayer. Sie teilen einen Satz Tokens für Farbe, Radius, Abstand und Schrift, ein Formular im Hero sieht also aus wie eines in den Einstellungen.
Jedes Element folgt den Mustern für Tastatur und Screenreader, die Menschen erwarten, von Pfeiltasten in Tabs bis zum Fokus, der im Dialog bleibt. Texteffekte, Textakzente, Hintergründe und Motion-Effekte ergänzen die Details, die einer Seite Charakter geben, und jeder davon ruht, wenn das System weniger Bewegung wünscht.
Buttons, Groups und Toggles.
Inputs, Textareas, Selects, Checkboxen, Radios, Switches, Slider, Suchfelder und Formular-Layouts.
Datum, Uhrzeit und Farbe wählen, Zahlenfelder, Comboboxen, Mehrfachauswahl und Tag-Felder, jede Wahl bleibt im Blick.
Telefonnummern mit Land, Kartendaten, Einmalcodes, Datei-Uploads, Profilbilder und Unterschriften.
Cards für Menschen, Produkte, Stats und Links.
Dialogs, Sheets, Popovers, Tooltips und Toasts.
Tabs, Accordions, Breadcrumbs, Pagination, Stepper und Linklisten.
Menüleisten mit Tastaturbedienung, schwebende Aktionen, die dem Scrollen folgen, und Sprachumschalter für jedes Layout.
Icons, Badges, Avatars, Tags, Tastenkürzel und Ratings.
Fortschrittsbalken und Ringe, Skeletons beim Laden, leere Zustände mit dem nächsten Schritt und Stat Cards mit einer Kennzahl.
Beschreibungslisten für Details, sortierbare Listen zum Ziehen, Baumansichten für Ordner und Timelines für Ereignisse in Folge.
Line, Bar, Area und Donut, radiale Charts, Heatmaps und Funnels für die alltäglichen Zahlen.
Vorher und nachher, Rankings, Zielwerte, Anteile am Ganzen und Wasserfälle, die zeigen, wie aus einem Wert ein anderer wird.
Streudiagramme, Verteilungen vom Histogramm bis zum Boxplot, Radarprofile und Treemaps für Daten mit vielen Punkten.
Gauges, Fortschrittsringe und Sparklines für Kennzahlen, laufend ankommende Daten, Kurskerzen und Werte nach Region auf einer Karte.
Headlines, die ankommen. Blur in, Buchstaben und Wörter nacheinander, Schreibmaschine und Scramble.
Farbverläufe, Schimmer, gezeichnete Marker, wechselnde Wörter und hochzählende Zahlen für die eine Zeile, auf die es ankommt.
Aurora, Gradient Mesh, Noise, leuchtende Punkte, auslaufende Raster und ein Spotlight, das dem Zeiger folgt.
Lichtstrahlen, Meteore, Partikel, Orbits, endlose Marquees und ein Licht, das um den Rand einer Karte wandert.
Video- und Audio-Player, Bildvergleich, Device Frames und QR-Codes.
Codeblöcke mit Dateireitern, Zeilennummern, Markierungen und Terminal-Stil, dazu JSON-Viewer zum Aufklappen, Durchsuchen und Pfade kopieren.
Veränderbare Bereiche, geteilte Ansichten und einklappbare Leisten.