Reihe

layout.cluster · v1.1.0 Horizontale Reihe mit Umbruch (Buttons, Badges, Meta-Zeilen) — wrappt fluid ohne Media Query WebsiteAppDesktopE-Mail

Stapel

layout.stack · v1.1.0 Vertikaler Stapel mit Token-Abstand — das Grundlayout für untereinander stehende Inhalte WebsiteAppDesktopE-Mail

Ankündigungs-Pille

ui.announcement · v1.0.1 Pill-Banner über einer Überschrift (Beispiel: Neu · Version 2 ist da): Markierung links, Text, optionaler Pfeil — als Link oder statisch WebsiteAppE-Mail

Avatar

ui.avatar · v1.0.1 Bild oder Initialen einer Person mit optionalem Status WebsiteAppDesktopE-Mail

Trennlinie

ui.divider · v1.2.0 Horizontale Trennlinie, optional mit zentriertem Beschriftungstext WebsiteAppDesktopE-Mail

Überschrift

ui.heading · v1.2.0 Überschrift der Ebenen 1–6 (anchor-Prop als Sprungziel für Inhaltsverzeichnisse) WebsiteAppDesktopE-Mail

Icon

ui.icon · v1.0.0 Kuratiertes Inline-SVG-Icon-Set (Whitelist) — Größen über icon-Tokens, Farbe über currentColor/Ton WebsiteAppDesktopE-Mail

Bild

ui.image · v1.1.0 Bild mit URL-Whitelist, Seitenverhältnis und Platzhalter-Fallback bei unsicherer Quelle WebsiteAppDesktopE-Mail

Tastenkürzel

ui.kbd · v1.0.0 Tastenkürzel-Anzeige — „Strg+K" wird zu einzelnen Tasten-Kappen mit + dazwischen WebsiteAppDesktopE-Mail

Link

ui.link · v1.0.0 Textlink mit URL-Whitelist — echte href-Navigation bleibt immer die Rückfallebene WebsiteAppDesktopE-Mail

QR-Code

ui.qr-code · v1.0.0 Serverseitig generierter QR-Code (SVG) — Belege, Zahlungs-Links, Geräte-Kopplung. Die Nutzdaten fließen nur ENCODIERT ein, nie als Markup WebsiteAppDesktopE-Mail

Relative Zeit

ui.relative-time · v1.0.0 Relative Zeitangabe („vor 3 Minuten“, „in 2 Tagen“) als natives time-Element mit absolutem Titel — serverseitig berechnet, now-Prop hält Demos deterministisch WebsiteAppDesktopE-Mail

Rich Text

ui.richtext · v1.2.0 Sanitisierter Rich-Text: Fliesstext-Semantik (h3-h6, Listen, Tabellen, mark/kbd/sub/sup/abbr/time, dl, figure) + Ton-Spans aus festem Vorrat (data-tone) WebsiteAppDesktopE-Mail

Text

ui.text · v1.0.0 Fließtext-Absatz mit Ton und Größe WebsiteAppDesktopE-Mail

Badge

ui.badge · v2.1.0 Status- oder Kategorie-Kennzeichen. BREAKING 2.0.0: Prop tone heißt jetzt variant (Migration 1-to-2 vorhanden) WebsiteAppDesktopE-Mail

Füllstand (Meter)

ui.meter · v1.0.0 Füllstands-Anzeige eines bekannten Bereichs (Speicher, Kontingent) — färbt sich nach Schwellwerten, im Unterschied zu ui.progress (Fortschritt eines Vorgangs) WebsiteAppDesktopE-Mail

Status-Anzeige

ui.status · v1.0.0 Zustands-Punkt mit Beschriftung (online, beeinträchtigt, offline, wartend) — Punkt pulsiert optional; Farben aus Status-Tokens WebsiteAppDesktopE-Mail

Detail-Liste (Begriff/Wert)

component.description-list · v1.0.0 Detail-Ansicht eines Datensatzes als Begriff/Wert-Zeilen (dl/dt/dd) — Werte-Arten text/badge/muted/code/link, ein- oder zweispaltig, optional gestreift WebsiteAppDesktopE-Mail

Tabelle

component.table · v1.3.0 Datentabelle aus columns/rows-Props — gestreift, dicht, mobil horizontal scrollbar, Sticky-Kopf + Spalten-Pinning WebsiteAppDesktopE-Mail

Hinweiskasten

component.callout · v1.0.0 Hervorgehobener Hinweis im Fliesstext (Ton aus festem Vorrat: info/success/warning/danger) mit optionalem Titel und Rich-Text-Inhalt WebsiteAppDesktopE-Mail

Card

component.card · v1.2.0 Inhaltskarte mit Media-, Inhalts- und Footer-Slot WebsiteAppDesktopE-Mail

Hinweis

component.alert · v1.1.1 Hinweis-Box in vier Tönen mit Icon, optional schließbar WebsiteAppDesktopE-Mail

Zitat-Karten (Social Proof)

section.quote-card · v1.1.1 Karten mit Zitat, Person, Handle und Plattform-Hinweis — statische Social-Proof-Karten ohne externen Abruf (keine Fremd-API zur Laufzeit) WebsiteE-Mail

E-Mail Nachricht

template.email.message · v1.0.0 Standard-Aufbau einer Nachricht: Absender-Zeile oben, Inhalt in der Mitte, Rechtliches und Abmeldung unten. Die Slots akzeptieren bewusst NUR mail-freigegebene Bausteine — was in keinem Mail-Programm trägt, soll hier gar nicht erst angeboten werden. E-Mail