Typographie/Schriften



H1 - Hauptüberschrift

Schriftgröße:

Zeilenhöhe:

Schriftart:

Farbe:

​45 px

42 px

Open Sans (600)

#​454545

Schriftgröße:

Zeilenhöhe:

Schriftart:

Farbe:

36 px

42 px

Open Sans (600)

#000000

Schriftgröße: 36 px

Zeilenhöhe: 42 px

Schriftart: Open Sans (600)

Farbe: #000000


H2 - Unterüberschrift

Schriftgröße:

Zeilenhöhe:

Schriftart:

Farbe:

​34 px

36 px

Open Sans (700)

#​454545

Schriftgröße:

Zeilenhöhe:

Schriftart:

Farbe:

30 px

36 px

Open Sans (700)

#000000

Schriftgröße: 30 px

Zeilenhöhe: 36 px

Schriftart: Open Sans (600)

Farbe: #000000


H3 - Zwischenüberschrift

Schriftgröße:

Zeilenhöhe:

Schriftart:

Farbe:

​30 px

30 px

Open Sans (700)

#​454545

Schriftgröße:

Zeilenhöhe:

Schriftart:

Farbe:

24 px

30 px

Open Sans (600)

#000000

Schriftgröße: 24 px

Zeilenhöhe: 30 px

Schriftart: Open Sans (600)

Farbe: #000000


H4 - Kleine Überschrift

Schriftgröße:

Zeilenhöhe:

Schriftart:

Farbe:

24 px

30 px

Open Sans

#​454545

Schriftgröße:

Zeilenhöhe:

Schriftart:

Farbe:

24 px

30 px

Open Sans

#000000

Schriftgröße: 24 px

Zeilenhöhe: 30 px

Schriftart: Open Sans

Farbe: #000000


Paragraph/Lauftext

Schriftgröße:

Zeilenhöhe:

Schriftart:

Farbe:

20 px

30 px

Open Sans

#​454545

Schriftgröße:

Zeilenhöhe:

Schriftart:

Farbe:

20 px

30 px

Open Sans

#606060

Schriftgröße: 20 px

Zeilenhöhe: 30 px

Schriftart: Open Sans

Farbe: #606060


Textdekoration:

Farbe:

Unterstrichen

#c8493e

Textdekoration:

Farbe:

Unterstrichen

#c8493e

Textdekoration: Unterstrichen

Farbe: #c8493e


Farben und Größen


Farbakzente:

Hintergrundfarbe (Inhalte):

Hintergrundfarbe (Boxed-Layout):

Topbar (Farbe):

Topbar (Größe):

Fußzeile (Farbe Hintergrund):

Fußzeile (Farbe Schrift):

#c8493e

#e9e9e9

#f7f7f7

-

-

#4f5b69

#ffffff

Bildergrößen und Formate


Gilt für die Seitengröße von 1200 px und 16/9-Format

Bildgröße volle Spalte - 1/1

Bildgröße halbe Spalte - 1/2

Bildgröße drittel Spalte - 1/3

Bildgröße viertel Spalte - 1/4

Bildgröße sechstel Spalte - 1/6

Bildgröße Full-Width

​Abstände (Standard)


Erster Inhalt auf Seite:

​Padding Oben: 15 px
​Padding Unten: 15 px​​​​

Margin Oben: -50 px
Margin Unten: 10 px

​Letzter Inhalt auf Seite:

​Padding Oben: 15 px
​Padding Unten: 15 px​​​​

Margin Oben: 10 px
Margin Unten: -50 px

Überschrift Groß:

​Padding Oben: 1 px
​Padding Unten: 1 px​​​​

Margin Oben: 20 px
Margin Unten: 50 px

​Oberste Colum:

​Padding Oben: 15 px
​Padding Unten: 15 px​​​​

Margin Oben: 10 px
Margin Unten: 10 px

​​Alle Inhalte in Columns:

​Padding Oben: 0 px
​Padding Unten: 0 px​​​​

Margin Oben: 0 px
Margin Unten: 0 px

​​​1/1-Content der keine Colum ist:

​Padding Oben: 15 px
​Padding Unten: 15 px​​​​

Margin Oben: 10 px
Margin Unten: 10 px

Beispiel der Textgestaltung


H1 - Überschrift

Paragraph/Lauftext - sit amet, consetetur sadipscing elitr, sed diam Ich bin ein Link eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

H2 - Unterüberschrift


H3 - Zwischenüberschrift

Paragraph/Lauftext - consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

H4 - Kleine Überschrift

Ich bin auch ein Link sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

H2 - Unterüberschrift


Das machst Du doch mit links!
Hast Du diesen Satz oder ähnliche früher auch gehört? Oder begegnet er Dir heute noch?Was macht das mit Dir?Fühl mal[...]
Wie nimmst Du Deine Welt wahr?
Wie nimmst Du Deine Welt wahr? Hast Du Dir schon einmal ganz bewusst Zeit genommen, um Situationen in Deinen Zellen[...]
Das Wasser ist leer …
Kommt Dir die Situation bekannt vor? Du sitzt an einem Tisch mit mehreren Leuten und würdest gerne noch ein Glas[...]
Hinderliche Gewohnheiten
Hinderliche Gewohnheiten Wo kommen die lästigen "Dinger" eigentlich her?Warum tun wir etwas immer und immer wieder, obwohl wir wissen, dass[...]
Positive Affirmationen
Positive Affirmationen Hilfreich oder eher nicht? Sehr oft wird gesagt, Du musst Dir postitive Sätze sagen und diese häufig wiederholen,[...]