Skip to content

Files

Latest commit

96f2b4d · Mar 10, 2021

History

History
57 lines (48 loc) · 2.28 KB

styleguide.md

File metadata and controls

57 lines (48 loc) · 2.28 KB

Important colors

Name hex-code where is it used Where is it from
brown-light-00 #e5cdad header sand in logo
brown-light-01 #f6ede2 every 2nd section like sand, but brighter
brown-dark #966b40 header, footer, reduction trunk in logo - slightly darkened for contrast
brown-dark-01 #895929 button:hover darken brown dark
green #3b8439
green-01 #4ba747 button--2ndary:hover brightened green
red c23934 " input help Salesforce Lightning Design System

Font sizes

Font level Mobile Size Desktop Size
4 38px 53px
3 27px 38px
2 20px 27px
1 14px 20px
0 10px 14px
Level where is it used
4 .hero__title
4 h1 (is .hero__title)
3 h2
2 h3
2 hero__supertitle
2 .hero__subjektorientiert
2 hero__supertitle
1 header
1 reduction
1 text
1 button
1 footer
1 button
1 text
0 footer
0 help text

Mobile: 1 Desktop:

Lines

Line width Where applied
1px Around important buttons
2px Below Header

z-index

z-index What
80 sticky header
100 Overlay