Styleguide

Erweiterungen

Inhaltsgruppen

Kontaktformular

Bilder & Bildgalerie

Listen

Sections

Sections: Bilder

Sections: Texte

Sections: Farbflächen

Sections: Videos

Logo

Farben

Akzentfarbe
Akzentfarbe aktiv
Farbe dezent

Akzentfarbe

Akzentfarbe aktiv

Schriftfarbe dezent

alternative Schriftfarbe

Schriftschatten Weiß

Schriftschatten Schwarz

Schriftschatten Akzentfarbe

Schriftschatten Akzentfarbe aktiv

Schriftschatten Dezent

Schriftschatten Alternative Schriftfarbe

Hintergrundfarbe

Hintergrund Akzentfarbe

Hintergrund Dezent

Farbige HR

Hintergründe

1
2
3
4
5
6

Buttons

Button einfach
Button farbig
Button hell
Button dunkel
Button einfach (klein)
Button farbig (klein)
Button hell (klein)
Button dunkel (klein)
Button einfach
Button einfach (klein)
Button farbig
Button farbig (klein)
Button hell
Button hell (klein)
Button dunkel
Button dunkel (klein)

Größen

Text kleiner -20%

Text Basisschriftgröße

Text größer 20%

Text größer 50%

Text größer 100%

Schriften

Fließtext-Layout immer 66% begrenzt. Lorem ipsum dolor 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. Lorem ipsum dolor 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.

 

Akzent Schriftart

Überschrift 1

Lorem ipsum dolor sit amet. Das ist ein Link. 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.

Überschrift 2

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Hier ist auch eine Verlinkung. 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.

Überschrift 3

Lorem ipsum dolor 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.

Überschrift 4

Lorem ipsum dolor 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.

Aufzählungszeichen

  • Aufzählungszeichen normal
    • Aufzählungszeichen normal
  • Aufzählungszeichen normal
  • Aufzählungszeichen normal
  • Aufzählungszeichen akzent
    • Aufzählungszeichen akzent
  • Aufzählungszeichen akzent
  • Aufzählungszeichen akzent
  • Aufzählungszeichen dezent
    • Aufzählungszeichen dezent
  • Aufzählungszeichen dezent
  • Aufzählungszeichen dezent
  1. Nummerierte Liste
    1. Nummerierte Liste
  2. Nummerierte Liste
  3. Nummerierte Liste

Links

Links normal

Links aktiv

Links besucht

# Spalte 1 Spalte 2 Spalte 3 Test lange Spalte Sehrlangeswortohneleerzeichen
1 Inhalt Inhalt Inhalt Test Test
2 Inhalt Inhalt Inhalt Test Test
3       Test Test
4       Test

Test

Überschrift

Lorem ipsum dolor sit amet, Nulla vitae elit libero, a pharetra augue. Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit.

# Spalte 1 Spalte 2 Spalte 3 langer Text um Verhalten mobil zu testen LangesWortohneUmbrüche
1 Inhalt Inhalt Inhalt    
2 Inhalt Inhalt Inhalt    
3          
4