Website Styleguide

Styleübersicht von Farben, Schriften, Größen, Formen für die neue Website

Akzent

Haupt Akzentfarbe

Akzent dunkel

Akzent Hover, Links

Dunkel

Fliess Text: Body

Sehr dunkel

Primärfarbe, Überschriften

Sehr Hell

Überschrift auf Dunkel

Hell

Fließtext auf Dunkel

Akzent 2

2. Akzentfarbe

Akzent 2 dunkel

Akzent 2 Dunkel, zb Hover

Titel 1

Lorem ipsum dolor sit amet consectetur adipiscing elit

Titel 2

Lorem ipsum dolor sit amet consectetur adipiscing elit aliquam

Titel 3

Lorem ipsum dolor sit amet consectetur adipiscing elit aliquam sollicitudin gravida

Titel 4

Lorem ipsum dolor sit amet consectetur adipiscing elit aliquam sollicitudin gravida praesent tristique

Titel 5

Lorem ipsum dolor sit amet consectetur adipiscing elit aliquam sollicitudin gravida praesent tristique volutpat ac, magnis

Titel 6

Lorem ipsum dolor sit amet consectetur adipiscing elit aliquam sollicitudin gravida praesent tristique volutpat ac, magnis dictumst egestas eleifend

Titel 7

Lorem ipsum dolor sit amet consectetur adipiscing elit aliquam sollicitudin gravida praesent tristique volutpat ac, magnis dictumst egestas eleifend ad tempor aptent sem sapien

Spezial

Lorem ipsum dolor sit amet consectetur adipiscing elit aliquam sollicitudin aliquam

Fließtext

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Fließtext bold

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Fließtext groß

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Fließtext klein

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Standart Button
button-dark
button-light
button-outline-dark
button-accent-2
Standart Button
button-light
button-outline-light
button-accent-2

Das ist eine sehr helle Box

Lorem ipsum dolor sit amet consectetur adipiscing elit tortor convallis elementum placerat vehicula est, nostra imperdiet ullamcorper magnis nullam enim pellentesque curabitur venenatis lectus fames sodales. 

Das ist eine helle Box

Lorem ipsum dolor sit amet consectetur adipiscing elit tortor convallis elementum placerat vehicula est, nostra imperdiet ullamcorper magnis nullam enim pellentesque curabitur venenatis lectus fames sodales. 

Das ist eine halbe Box

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Das ist eine halbe Box​

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Das ist eine Box in Akzentfarbe

Lorem ipsum dolor sit amet consectetur adipiscing elit tortor convallis elementum placerat vehicula est, nostra imperdiet ullamcorper magnis nullam enim pellentesque curabitur venenatis lectus fames sodales. 

Das ist eine große Box in dunkler Farbe

Lorem ipsum dolor sit amet consectetur adipiscing elit tortor convallis elementum placerat vehicula est, nostra imperdiet ullamcorper magnis nullam enim pellentesque curabitur venenatis lectus fames sodales.

Das ist eine kleine Box in sehr dunkler Farbe

Lorem ipsum dolor sit amet consectetur adipiscing elit tortor convallis elementum placerat vehicula est, nostra imperdiet ullamcorper magnis nullam enim pellentesque curabitur venenatis lectus fames sodales.