Zur NavigationZum InhaltKontaktMenuFind componentOverview MobilePrinciplesFoundationAccessibilityDesign 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 TokensComponentsRoadmapOverviewBaseInformationenOverviewBaseComponentsSense & PurposeCommunity AssetsInstructionsApp IconsPower-AppsDigital banner adsSAP Design GuidelinesRadiobutton Overview
What does the component do?
It is used for the selection of exactly one option from several.
When should the component be used?
When there are two or more options and the options mutually exclude one another.
Rules
There must be a choice of at least two options.
A pre-selection is mandatory.
Radio buttons can be arranged vertically or horizontally. The vertical layout is preferred as it allows the user to understand the options more quickly.
Horizontal layout only for two to three options and short names.
The text can be multi-line.
As well as the actual radio button, the entire text also serves as a click target.