Zur Navigation Zum Inhalt Kontakt Menu 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 Funktionale 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 Roadmap Übersicht Basis Informationen Übersicht Basis Komponenten Sinn & Zweck Community Assets Anleitung Power-Apps Digitale Werbebanner SAP App Icons Basis-Farben

Hier setzen wir auf eine pointierte Reduktion: Farben werden nur dezent eingesetzt. Rot wird für die wichtigen Navigationselemente verwendet, die dem Benutzer eine schnelle und verständliche Leitung durch die Seite bietet. Verläufe sind nicht erlaubt.

Farben
Rot
Red

HEX: #EB0000

RGB: R: 235 G: 0 B: 0

Red125

HEX: #C60018

RGB: R: 198 G: 0 B: 24

Red150

HEX: #A20013

RGB: R: 162 G: 0 B: 19

Weiss, Grau, Schwarz
White

HEX: #FFFFFF

RGB: R: 255 G: 255 B: 255

Milk

HEX: #F6F6F6

RGB: R: 246 G: 246 B: 246

Cloud

HEX: #E5E5E5

RGB: R: 229 G: 229 B: 229

Silver

HEX: #DCDCDC

RGB: R: 220 G: 220 B: 220

Aluminum

HEX: #D2D2D2

RGB: R: 210 G: 210 B: 210

Platinum

HEX: #CDCDCD

RGB: R: 205 G: 205 B: 205

Cement

HEX: #BDBDBD

RGB: R: 189 G: 189 B: 189

Graphite

HEX: #B7B7B7

RGB: R: 183 G: 183 B: 183

Storm

HEX: #A8A8A8

RGB: R: 168 G: 168 B: 168

Smoke

HEX: #8D8D8D

RGB: R: 141 G: 141 B: 141

Metal

HEX: #767676

RGB: R: 118 G: 118 B: 118

Granite

HEX: #686868

RGB: R: 104 G: 104 B: 104

Anthracite

HEX: #5A5A5A

RGB: R: 90 G: 90 B: 90

Iron

HEX: #444444

RGB: R: 68 G: 68 B: 68

Charcoal

HEX: #212121

RGB: R: 33 G: 33 B: 33

Midnight

HEX: #151515

RGB: R: 21 G: 21 B: 21

Black

HEX: #000000

RGB: R: 0 G: 0 B: 0

Blau
Blue

HEX: #2d327d

RGB: R: 45 G: 50 B: 125

Kontraste überprüfen Farbverhältnisse

SBB Webseiten sind in den folgenden Farbverhältnissen zu gestalten. Die Quantitäten sind als Richtwerte zu verstehen – nicht als exakte Regel. Signifikante Abweichungen sind jedoch zu vermeiden. Wenn diese unumgänglich ist eine Prüfung durch die SBB Markenführung notwendig.

60%
25%
10%
5%
Impressum Kontakt Cookie Einstellungen