Headline 1 ohne Abstand

H1 Desktop sollte sein:

Myriad Light  ·  80 px Schriftgröße  ·  95 px Zeilenabstand  ·  0px Absatzbstand  ·  0 Laufweite (Zeichenabstand) · L 65px Margin Bottom

Headline 2

H2 Desktop sollte sein: 

Myriad Light  ·  60 px Schriftgröße  ·  66 px Zeilenabstand  ·  0px Absatzbstand  ·  10 Laufweite (Zeichenabstand) · M 45px Margin Bottom

Headline 3

H3 Desktop sollte sein: 

Myriad Light  ·  40 px Schriftgröße  ·  48 px Zeilenabstand  ·  0px Absatzbstand  ·  0 Laufweite (Zeichenabstand) · S 30px Margin Bottom

Headline 4

H4 Desktop sollte sein: 

Myriad Regular  ·  32 px Schriftgröße  ·  36 px Zeilenabstand  ·  0px Absatzbstand  ·  10 Laufweite (Zeichenabstand) · S 30px Margin Bottom

Aberichung in den großen Würfel-CTAs: BOLD

Headline 5

H5 Desktop sollte sein: 

Myriad Semibold  ·  24 px Schriftgröße  ·  28 px Zeilenabstand  ·  0px Absatzbstand  ·  10 Laufweite (Zeichenabstand) · S 30px Margin Bottom

Herotext 1 – Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua.

Herotext 1 sollte sein: 

Myriad Light  ·  55 px Schriftgröße  ·  60 px Zeilenabstand  ·  0 px Absatzbstand  ·  0 Laufweite (Zeichenabstand) · L 65px Margin Bottom

Herotext 2 – Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua.

Herotext 2 sollte sein: 

Myriad Light  ·  36 px Schriftgröße  ·  48 px Zeilenabstand  ·  15 px Absatzbstand  ·  10 Laufweite (Zeichenabstand) · S 30px Margin Bottom

Herotext 3 – Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid

Herotext 3 sollte sein: 

Myriad Regular  ·  20 px Schriftgröße  ·  30 px Zeilenabstand  ·  15 px Absatzbstand  ·  10 Laufweite (Zeichenabstand) · S 30px Margin Bottom

Copy 01 = Normal ­– Das hier soll der ganz normale Absatztext sein. Lorem ipsum dolor  Textlink sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid.

  • Die Aufzählungszeichen sind Geviertstriche

  • Ut enim ad minim veniam, quis nostrud

  • consectetur adipisici elit

  • sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam

  1. Ut enim ad minim veniam, quis nostrud

  2. consectetur adipisici elit

  3. sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam

Ab hier ohne zugewiesenem Stil - Copy 01 = Normal sollte sein: 

Myriad Regular  ·  18 px Schriftgröße  ·  24 px Zeilenabstand  ·  10 px Absatzbstand  ·  0 Laufweite (Zeichenabstand)

Copy 02 - Stil fehtl noch - Lorem ipsum dolor Textlink sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid.

  • Die Aufzählungszeichen sind Geviertstriche

  • Ut enim ad minim veniam, quis nostrud 

  • consectetur adipisici elit

  • sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam

  1. Ut enim ad minim veniam, quis nostrud

  2. consectetur adipisici elit

  3. sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam

Copy 02 (kleinere Copy) sollte sein: 

Myriad Regular  ·  16 px Schriftgröße  ·  21 px Zeilenabstand  ·  7 px Absatzbstand  ·  0 Laufweite (Zeichenabstand)

Quote – Lorem ipsum dolor Textlink sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid

Quote sollte sein (wie Herotext 2): 

Myriad Light  ·  36 px Schriftgröße  ·  48 px Zeilenabstand  ·  15 px Absatzbstand  ·  10 Laufweite (Zeichenabstand)

Copy 02 - Stil fehtl noch - Lorem ipsum dolor Textlink sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid.

  • Die Aufzählungszeichen sind Geviertstriche
  • Ut enim ad minim veniam, quis nostrud 
  • consectetur adipisici elit
  • sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam
  1. Ut enim ad minim veniam, quis nostrud
  2. consectetur adipisici elit
  3. sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam

Copy 02 (kleinere Copy) sollte sein: 

Myriad Regular  ·  16 px Schriftgröße  ·  21 px Zeilenabstand  ·  7 px Absatzbstand  ·  0 Laufweite (Zeichenabstand)

Standard-Buttons und Links

Für alle Buttons gilt: Je nach Bereich, in dem sie gesetzt werden, erhalten sie automatisch die richtige Kategoriefarbe.

 

Button  – Dieser Stil darf nur im B2B benutzt werden. Sollte er im B2C benutzt werden, dann nur in Midnight Blue.

Pfeillinks gibts in 2 Größen: L & M (Desktop), S & XS (mobil):

Dies ist der Pfeillink L (mobil S)

Dies ist der Pfeillink M (mobil XS)

Link mit Pfeil – Diese Stil sollte wegfallen.

Ein Textlink ist eine Unterstreichung in Hellblau. Der Hover macht den Text dann ebenfalls hellblau.

Tabellen

Nullam dictum   semper nisi  x  Integer tincidunt. Cras dapibus  1.225,25
 enean vulputa   Duis leo. Sed fringilla mauris sit amet nibh  ullamcorper ultricies nisi. Nam eget dui. Etiam rhoncus. Maecenas tempus, tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed i  y  12.269,21
Etiam ultricies Donec quam felis   semper nisi 1.258,44
sit amet adipiscing sem neque sed ipsum   Duis leo. Sed fringilla mauris sit amet nibh. Donec sodales sagittis magna. Sed consequat, leo eget bibendum sodales 90,–

 

Zweispaltige, Tabelle 1 zu 2

Nullam dictum   semper nisi  x  Integer tincidunt. Cras dapibus  1.225,25
 enean vulputa   Duis leo. Sed fringilla mauris sit amet nibh  ullamcorper ultricies nisi. Nam eget dui. Etiam rhoncus. Maecenas tempus, tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed i  y  12.269,21
Etiam ultricies Donec quam felis   semper nisi 1.258,44
sit amet adipiscing sem neque sed ipsum   Duis leo. Sed fringilla mauris sit amet nibh. Donec sodales sagittis magna. Sed consequat, leo eget bibendum sodales 90,–