Zur NavigationZum InhaltKontaktMenuFind componentOverview Web (Legacy)PrinciplesFoundationAccessibilityDesign SystemGuidelinesDeutschFrançaisItalianoEnglishOur design principlesUser-centredRecognisableInclusiveReducedHolisticSelf-explanatoryTask-orientedAppropriateSBB Brand portalLogoDigital clockRights of useBase colorsFunctional colorsOff brand colorsIconsTimetable iconsPictogramsAbout accessibilityÜber diesen GuideContactFurther informationProduct OwnerUser ResearchInteraction DesignVisual DesignDevelopmentContent DesignTestingWhat is a design system?DesigningCodingFAQHelpProcessContributionContactOverviewBaseComponentsOverviewReleasesDesign TokensKomponentenOverviewBaseInformationenOverviewBaseComponentsSense & PurposeCommunity AssetsInstructionsPower-AppsDigital banner adsSAP Design GuidelinesApp IconsNotification Overview
What does the component do?
It is used to display messages that concern an entire page.
When should the component be used?
When a user has triggered an action on a page and should receive feedback from the system.
Rules
Notifications only ever appear after an action has been triggered by the user.
The width is always the same as the content area.
The height is based on the length of the message text.
States and variants
Variants
Confirmation
Information
Error
Error with jump marker
* The individual jump markers are separated by a ‘/’.{.lead} * Clicking on a skip marker scrolls directly to the cause of the error.{.lead} * The jump marker target is always on the same page as the notification (no jumping to other pages).{.lead}