Design System
Playground Zur Vorlage

Komponenten · RückmeldungToast

Komponente · 6 Varianten

Toast

components/Toast.astro

Kurze Meldung invers, z 60, unten links oder rechts. Signal-Punkt, optional Aktion, Stapel von drei.

Notizen

  • Bestand: z-index toast 60 definiert, kein Toast.
  • Invers statt Fond: Deckel-Optik. Kein Radius, kein Schatten.

Props

Name Typ Default Notiz
variant "neutral" | "erfolg" | "fehler" | "aktion" | "stapel" | "position" "neutral" 01–06.
surface "nacht" | "paper" "nacht" Pflicht-Paar.
<Toast variant="neutral" surface="nacht" />

01 · Neutral

Punkt granit-500

Signal info. Gespeichert.

Nacht

Gespeichert

Paper

Gespeichert

02 · Erfolg

Punkt oliv-500

Signal success. —

Nacht

Gesendet

Paper

Gesendet

03 · Fehler

Punkt granit-800

Signal error. —

Nacht

Nicht gesendet

Paper

Nicht gesendet

04 · Aktion

Rückgängig-Link

Anfrage. Unterstrich.

Nacht

Gespeichert

Paper

Gespeichert

05 · Stapel

Drei übereinander

Anfrage. gap-2.

Nacht

Gespeichert
Slot angefragt
Mail gesendet

Paper

Gespeichert
Slot angefragt
Mail gesendet

06 · Position

Unten rechts

Anfrage. —

Nacht

Gespeichert

Paper

Gespeichert