Prinzipien Grundlagen Barrierefreiheit Design System Guidelines Deutsch Français Italiano English Unsere Gestaltungsprinzipien Nutzerzentriert Wiedererkennbar Inklusiv Reduziert Ganzheitlich Selbsterklärend Aufgabenorientiert Passend SBB Markenportal Logo Digitale Uhr Nutzungsrechte Basis-Farben Zusätzliche Farben Off-Brand Farben Icons Fahrplan-Icons Piktogramme Über Barrierefreiheit Über diesen Guide Kontakt Weitere Informationen Product Owner User Research Interaction Design Visual Design Development Content Design Testing Was ist ein Design System?​ Designing Coding FAQ Hilfe Prozess Contribution Kontakt Übersicht Basis Komponenten Übersicht Releases Design Tokens Komponenten Übersicht Basis Informationen Übersicht Basis Komponenten Übersicht Power-Apps Digitale Werbebanner SAP AI Design: Grundlagen App Icons Header-Box Übersicht

Was macht die Komponente?

  • Anzeigen von wichtigen Informationen oder Funktionen.

Wann soll die Komponente eingesetzt werden?

  • Bei wichtigen Informationen oder Funktionen, welche immer verfügbar sein sollen.

Regeln

  • Die Header-Box liegt über dem Header und dem Content.
  • Inhalte scrollen unter die Header-Box.
  • Die Header-Box kann sich abhängig vom Scrollen verändern und sich beispielsweise verkleinern.
Varianten

Varianten

Die Komponente hat folgende Varianten:

  • Subtext: Optional
  • Icon: Optional
  • Button: Optional
  • Loading: Optional
  • Flap: Optional

Header-Box

Darstellung einer Header-Box
Darstellung einer Header-Box

Spezifikationen

Design