Grundsätzliche Vorgaben

  • Abschnitt: Inhaltsbreite: Boxed, Breite: 1280 px, (Höhe: Vorgabe oder 810)
  • Klickbare Elemente haben immer einen Schlagschatten, nicht klickbare Elemente sind ohne Schatten
  •  

Schrift

  • Texte & Titel Linksbündig
  • 8 px Differenz von Schriftgröße zu Zeilenabstand
  • Abstand Titel zu Fließtext: Erweitert / Außenabstand / Unten: 10 px
  • Body: Roboto 18 px, Line Height 26 px, Schriftschnitt 400 Normal

Buttons

Der Primary Button spiegelt das Ziel einer Seite wider und hat innerhalb von einer Seite immer das gleiche Label z.B. “Fachgespräch vereinbaren”.

Spezifikationen:

  • Text: Roboto, weiß, 20px, Schriftschnitt 500 (Medium)
  • Hintergrund: grün
  • Border Type: Vorgabe
  • Borderradius: 4
  • Boxshadow:
    •  Farbe: #00000061
    •  Horizontal: 0
    •  Vertikal: 8
    • Unschärfe: 8
    • Ausbreitung: 0
    • Position: Kontur
  •  Hover Interactions (Erweitert): Hover / Transform / Scale jeweils bei X und Y: 1,1

Der Secondary Button wird für weitere Verlinkungen auf einer Seite verwendet. Anders als beim Primary Button können mehrere gleichwertige Secondary Buttons auf einer Seite verwendet werden.

Spezifikationen:

  • Text: Roboto, grün, 20px, Schriftschnitt 500 (Medium)
  • Hintergrund: transparent oder weiß, je nach Verwendung
  • Border Type: Vorgabe
  • Bordertype: Durchgezogen, Breite 3
  • Borderradius: 4
  • Boxshadow:
    •  Farbe: #C0C0C0
    •  Horizontal: 0
    •  Vertikal: 8
    • Unschärfe: 8
    • Ausbreitung: 0
    • Position: Kontur
  •  Hover Interactions (Erweitert): Hover / Transform / Scale jeweils bei X und Y: 1,1

Nicht klickbare Aufzählung

Dieses Element wird verwendet, wenn z.B. Branchen aufgezählt und dabei nicht verlinkt werden. Die Icons müssen dabei aus unserer eigenen Icon-Bibliothek gewählt werden.

Headline


Hier steht Beschreibungstext. Die gesamte Zeile passt sich an das höchste Element an.

Headline


Mobil müssen die Außenabstände kontrolliert und ggf. angepasst werden.

Headline


Hier steht Beschreibungstext. Die gesamte Zeile passt sich an das höchste Element an.

Headline


Gibt es in einer Zeile nur zwei Elemente, müssen die Außenabstände entsprechend angepasst werden.

Headline


Hier steht Beschreibungstext. Die gesamte Zeile passt sich an das höchste Element an.

Scroll to Top