Toast Message

Toast Messages geben Rückmeldung auf Aktionen, Handlungen und Ergebnisse.

  • Schrack Seconet
  • Neutral
  • Verwendung

Beispiel

Eine Toast Message kann sich in vier verschiedenen Zuständen befinden:

  • Information
  • Success
  • Warning
  • Error

Zusätzlich kann es Single Toast Messages und Multiple Toast Messages geben. Sie wird immer rechts direkt unterhalb des Headers platziert und wandert auch wenn man nach unten scrollt mit. (sticky)

Cookies akzeptieren

Die Toast Message ist 600px breit und verhält sich in der Höhe passend zum Text. Das heißt, auch mehrzeiliger Text ist möglich.

Cookies akzeptieren

Showcases

Single Toast Message

Einzelne Toast Messages werden auf Desktop-Ansichten am linken oberen Bildschirmrand unterhalb des Headers angezeigt.

Cookies akzeptieren

Multiple Toast Message

Wenn mehrere Toast Messages gleichzeitig angezeigt werden sollen, dann werden diese auf Desktop-Ansichten vertikal am rechten oberen Bildschirmrand unter dem Header aufgelistet. Der Abstand zwischen den einzelnen Toast Messages beträgt 16px. Ältere Toast Messages werden nach unten geschoben, sodass die oberste Toast Message immer die neuesten Informationen beinhaltet.

Cookies akzeptieren
Über das Design SystemWas gibt es Neues?Für DeveloperFür DesignerComponentsFoundationsIcon LibraryFeedbackFAQKontaktImpressumDatenschutz