Principes Bases Accessibilité Système de design Guidelines Deutsch Français Italiano English Nos principes de design Centré sur l’utilisateur Reconnaissable Inclusif Minimaliste Holistique Auto-explicatif Axé sur les tâches Approprié Portail de la marque CFF Logo Horloge numérique Droits d’utilisation Couleurs de base Couleurs fonctionnelles Couleurs off-brand Icônes Icônes de l’horaire Pictogrammes À propos de l’accessibilité À propos de ce guide Contact Informations complémentaires Product Owner User Research Interaction Design Visual Design Development Content Design Testing What is a design system? Conception Développer FAQ Aide Procès Contribution Contact Aperçu Base Composants Overview Releases Design Tokens Composants Aperçu Base Informations Aperçu Base Composants Sens & objectif Community Assets Instructions Power-Apps Bandeaux publicitaires numériques SAP Icônes d’applications Cette page n'est pas disponible dans la langue souhaitée. Langues disponibles Deutsch English Shadow

Elevation Level: 3
Soft Positive@include sbb.shadow-level-3-soft;
Hard Positive@include sbb.shadow-level-3-hard;
Soft Negative@include sbb.shadow-level-3-soft-negative;
Hard Negative@include sbb.shadow-level-3-hard-negative;

sbb-shadow-elevation-level-3-shadow-1-offset-x

0

sbb-shadow-elevation-level-3-shadow-1-offset-y

2

sbb-shadow-elevation-level-3-shadow-1-blur

16

sbb-shadow-elevation-level-3-shadow-1-spread

0

sbb-shadow-elevation-level-3-shadow-2-offset-x

0

sbb-shadow-elevation-level-3-shadow-2-offset-y

1

sbb-shadow-elevation-level-3-shadow-2-blur

4

sbb-shadow-elevation-level-3-shadow-2-spread

0

sbb-shadow-elevation-level-3-soft-1-color

rgba(141, 141, 141, 0.05)

sbb-shadow-elevation-level-3-soft-2-color

rgba(141, 141, 141, 0.1)

sbb-shadow-elevation-level-3-soft-negative-1-color

rgba(0, 0, 0, 0.15)

sbb-shadow-elevation-level-3-soft-negative-2-color

rgba(0, 0, 0, 0.2)

sbb-shadow-elevation-level-3-hard-1-color

rgba(141, 141, 141, 0.1)

sbb-shadow-elevation-level-3-hard-2-color

rgba(141, 141, 141, 0.2)

sbb-shadow-elevation-level-3-hard-negative-1-color

rgba(0, 0, 0, 0.3)

sbb-shadow-elevation-level-3-hard-negative-2-color

rgba(0, 0, 0, 0.4)

Elevation Level: 5
Soft Positive@include sbb.shadow-level-5-soft;
Hard Positive@include sbb.shadow-level-5-hard;
Soft Negative@include sbb.shadow-level-5-soft-negative;
Hard Negative@include sbb.shadow-level-5-hard-negative;

sbb-shadow-elevation-level-5-shadow-1-offset-x

0

sbb-shadow-elevation-level-5-shadow-1-offset-y

4

sbb-shadow-elevation-level-5-shadow-1-blur

32

sbb-shadow-elevation-level-5-shadow-1-spread

0

sbb-shadow-elevation-level-5-shadow-2-offset-x

0

sbb-shadow-elevation-level-5-shadow-2-offset-y

1

sbb-shadow-elevation-level-5-shadow-2-blur

8

sbb-shadow-elevation-level-5-shadow-2-spread

0

sbb-shadow-elevation-level-5-soft-1-color

rgba(141, 141, 141, 0.05)

sbb-shadow-elevation-level-5-soft-2-color

rgba(141, 141, 141, 0.1)

sbb-shadow-elevation-level-5-soft-negative-1-color

rgba(0, 0, 0, 0.15)

sbb-shadow-elevation-level-5-soft-negative-2-color

rgba(0, 0, 0, 0.2)

sbb-shadow-elevation-level-5-hard-1-color

rgba(141, 141, 141, 0.1)

sbb-shadow-elevation-level-5-hard-2-color

rgba(141, 141, 141, 0.2)

sbb-shadow-elevation-level-5-hard-negative-1-color

rgba(0, 0, 0, 0.3)

sbb-shadow-elevation-level-5-hard-negative-2-color

rgba(0, 0, 0, 0.4)

Elevation Level: 9
Soft Positive@include sbb.shadow-level-9-soft;
Hard Positive@include sbb.shadow-level-9-hard;
Soft Negative@include sbb.shadow-level-9-soft-negative;
Hard Negative@include sbb.shadow-level-9-hard-negative;

sbb-shadow-elevation-level-9-shadow-1-offset-x

0

sbb-shadow-elevation-level-9-shadow-1-offset-y

16

sbb-shadow-elevation-level-9-shadow-1-blur

128

sbb-shadow-elevation-level-9-shadow-1-spread

0

sbb-shadow-elevation-level-9-shadow-2-offset-x

0

sbb-shadow-elevation-level-9-shadow-2-offset-y

4

sbb-shadow-elevation-level-9-shadow-2-blur

32

sbb-shadow-elevation-level-9-shadow-2-spread

0

sbb-shadow-elevation-level-9-soft-1-color

rgba(141, 141, 141, 0.05)

sbb-shadow-elevation-level-9-soft-2-color

rgba(141, 141, 141, 0.1)

sbb-shadow-elevation-level-9-soft-negative-1-color

rgba(0, 0, 0, 0.15)

sbb-shadow-elevation-level-9-soft-negative-2-color

rgba(0, 0, 0, 0.2)

sbb-shadow-elevation-level-9-hard-1-color

rgba(141, 141, 141, 0.1)

sbb-shadow-elevation-level-9-hard-2-color

rgba(141, 141, 141, 0.2)

sbb-shadow-elevation-level-9-hard-negative-1-color

rgba(0, 0, 0, 0.3)

sbb-shadow-elevation-level-9-hard-negative-2-color

rgba(0, 0, 0, 0.4)

Elevation Level: 11
Soft Positive@include sbb.shadow-level-11-soft;
Hard Positive@include sbb.shadow-level-11-hard;
Soft Negative@include sbb.shadow-level-11-soft-negative;
Hard Negative@include sbb.shadow-level-11-hard-negative;

sbb-shadow-elevation-level-11-shadow-1-offset-x

0

sbb-shadow-elevation-level-11-shadow-1-offset-y

24

sbb-shadow-elevation-level-11-shadow-1-blur

192

sbb-shadow-elevation-level-11-shadow-1-spread

0

sbb-shadow-elevation-level-11-shadow-2-offset-x

0

sbb-shadow-elevation-level-11-shadow-2-offset-y

4

sbb-shadow-elevation-level-11-shadow-2-blur

64

sbb-shadow-elevation-level-11-shadow-2-spread

0

sbb-shadow-elevation-level-11-soft-1-color

rgba(141, 141, 141, 0.05)

sbb-shadow-elevation-level-11-soft-2-color

rgba(141, 141, 141, 0.1)

sbb-shadow-elevation-level-11-soft-negative-1-color

rgba(0, 0, 0, 0.15)

sbb-shadow-elevation-level-11-soft-negative-2-color

rgba(0, 0, 0, 0.2)

sbb-shadow-elevation-level-11-hard-1-color

rgba(141, 141, 141, 0.1)

sbb-shadow-elevation-level-11-hard-2-color

rgba(141, 141, 141, 0.2)

sbb-shadow-elevation-level-11-hard-negative-1-color

rgba(0, 0, 0, 0.3)

sbb-shadow-elevation-level-11-hard-negative-2-color

rgba(0, 0, 0, 0.4)
Contact

Vous avez des questions ? Vous trouverez peut-être une réponse dans notre FAQ ou notre aide, sinon vous pouvez poser votre question sur le board correspondant sur Github.

Impressum Contact Protection des données Paramètres des cookies