The brand
SBB Brand portal
Logo
Digital clock
Rights of useColors
Base colors
Functional colors
Off brand colorsAssets
Icons
Timetable icons
Pictograms
Introduction
About accessibility
Über diesen Guide
Contact
Further informationAccessibility by roles
Product Owner
User Research
Interaction Design
Visual Design
Development
Content Design
Testing
First steps
What is a design system?
Designing
Coding
FAQ
HelpOrganisation
Process
Contribution
ContactMobile
Overview
Base
ComponentsLyne
Overview
Releases
Design Tokens
KomponentenMaps
Overview
Base
InformationenLean (Legacy)
Overview
Base
ComponentsCommunity Assets
Sense & Purpose
Community Assets
Instructions
Guides
Power-Apps
Digital banner ads
SAP Design GuidelinesRegulations
App Icons
Button
Overview
What does the component do?
It triggers an action.
When should the component be used?
When starting or ending a process.
When sending a form.
When selecting a function.
Rules
It cannot be used within body copy.
The text is always single-line.
Only one primary button can be used per page/dialogue.
Several secondary buttons are permitted per page/dialogue.
Secondary and frameless buttons can only be used if a primary button already exists.
States and variants
States
The component has the following states:
Normal
Pressed
Disabled
Loading
Variants
Primary
* Full width of the screen or modal dialogue (minus spacing).{.lead}
Secondary
* Full width of the screen or modal dialogue (minus spacing).{.lead}