Base colors

Here, we focus on intentional reduction: colors are only used in a subtle way. Red is used for the important navigation elements that offer the user a quick and understandable path through the page. Flows are not allowed.

Colors
Red
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

White, Grey, Black
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

Blue
Blue

HEX: #2d327d

RGB: R:45 G:50 B:125

Checking contrasts Colour ratios

SBB websites are designed with the following colour ratios. The quantities are to be take as guidelines – not as exact regulations – but significant deviations are to be avoided. If this is unavoidable, a check by SBB Brand Management is required.

60%
25%
10%
5%