The brandLink target opens in a new window. SBB Brand portal Logo Digital clock Rights of useColors Base colors Additional colors Off brand colorsAssets Icons Timetable icons PictogramsLanguage About UX Writing Button and link texts Forms and inputs Notifications Progress indicators Digital word list
Introduction About accessibility About this 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 What is Lyne? Releases Presets & Themes Design Tokens Components TemplatesMaps Overview Base InformationsPatterns Overview
Regulations App IconsGuides Power-Apps Digital banner ads SAP Design Guidelines AI Design: Basics
Pagination.
Overview
What does the component do?
It scrolls through a list of elements or pages.
When should the component be used?
For long lists of elements or pages.
Rules
The number of elements per page must be defined on a context-specific base.
A maximum of five page numbers are shown.
Keyboard operation
the active page cannot be jumped to.
Tab sequence: Arrow back, first page that can be jumped to, next page that can be jumped to etc., arrow forward.
The short form “…” for hidden pages cannot be jumped to.
Variants
States
The component has the following states:
First
Middle
Last
Hover
Variants
Default
Specifications
Link target opens in a new window.DesignLink target opens in a new window.Code