Styleguide2018-12-13T10:41:31+00:00

Styleguide

Die Richtlinien zur Anwendung unserer Corporate Identity.

Bei SPIEGLHOF media achten wir auf eine konsistente Außenwirkung in Printmedien und Web. Dazu haben wir einen hauseigenen Styleguide entwickelt. Dieser definiert die Verwendung von Logo, Farben, Schriftarten und weiteren Gestaltungselementen in Web und Print. Sie können unseren Styleguide gerne als Vorlage für Ihr eigenes Unternehmen verwenden und nach Belieben ergänzen.

Farben

Wenn wir Web- oder Printprodukte gestalten, dann verwenden wir ausschließlich die nachfolgenden Farben unserer Corporate Identity.

Black
#191919

Titan Dark
#2F373E

Titan
#39424A

Titan Light
#DDE3EC

White
#F5F5F5

Brown
#7E6C36

Green Dark
#617A38

Green
#7D9241

Green Light
#9DB852

Überschriften 1. Ordnung

Schriftfarbe (color) #2f373e // Schriftgröße (font-size) 60px // Schriftart (font-family) Open Sans Condensed, Arial, Helvetica, sans-serif // Strichstärke (font-weight) 700 // Zeilenhöhe (line-height) 1.1 // Abstand (margin) 0, 0, 0.3em, 0

Überschriften 2. Ordnung

Schriftfarbe (color) #2f373e // Schriftgröße (font-size) 48px // Schriftart (font-family) Open Sans Condensed, Arial, Helvetica, sans-serif // Strichstärke (font-weight) 300 // Zeilenhöhe (line-height) 1.3 // Abstand (margin) 0.1, 0, 0.4em, 0

Überschriften 3. Ordnung

Schriftfarbe (color) #2f373e // Schriftgröße (font-size) 20px // Schriftart (font-family) Open Sans, Arial, Helvetica, sans-serif // Strichstärke (font-weight) 700 // Zeilenhöhe (line-height) 1.5 // Abstand (margin) 1em, 0, 0.4em, 0

Absätze

Schriftfarbe (color) #2f373e // Schriftgröße (font-size) 20px // Schriftart (font-family) Open Sans, Arial, Helvetica, sans-serif // Strichstärke (font-weight) 400, steigt bei Fettdruck auf 700, verbleibt bei Kursivdruck auf 400 // Zeilenhöhe (line-height) 1.5 // Abstand (margin) 0, 0, 20px, 0

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.

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. 

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.

Buttons

Abrundung Ecken (border-radius) 2px // Schriftgröße (font-size) 18px // Schriftart (font-family) Open Sans Condensed, Arial, Helvetica, sans-serif // Fläche um Text (padding) 13px, 29px

Primary
Secondary
Link
Link