Styleguide

CI Elemente

Eine Übersicht der wichtigsten Gestaltungselemente für die Website.

Headlines

Headline H1

Headline H2

Headline H3

Headline H4

Headline H5
Headline H6

Texte

Dies ist ein Lead-Text. Er eignet sich für Einleitungen oder besonders wichtige Absätze.

Dies ist ein normaler Fließtext. Er sollte gut lesbar sein und ausreichend Abstand zu anderen Elementen haben.

Dies ist ein kleiner Hinweistext oder ergänzender Beschreibungstext.

Listen

Ungeordnete Liste

  • Erster Listenpunkt
  • Zweiter Listenpunkt
  • Dritter Listenpunkt

Geordnete Liste

  1. Erster Schritt
  2. Zweiter Schritt
  3. Dritter Schritt

Buttons

CTA Button Zurück / Schließen Bootstrap Primary Bootstrap Secondary Textlink

Links

Dies ist ein Absatz mit einem normalen Textlink.

Hervorgehobener Link

Cards

Card Titel

Kurzer Beschreibungstext für eine Card.

Mehr erfahren

Card Titel

Eine weitere Card mit etwas mehr Inhalt und einem sekundären Button.

Details ansehen

Card Titel

Cards eignen sich gut für Teaser, Leistungen oder kurze Inhaltsblöcke.

Hinweise

Formularelemente

Layout-Abstände

Abstand mit p-3 und mb-3
Abstand mit p-4 und mb-3
Abstand mit p-5

CTA Bereich

Beispiel für einen hervorgehobenen Abschlussbereich mit Text und Button.

Jetzt Kontakt aufnehmen