Skip to content

Documentation Corporate Identity

Wiki Warden edited this page Jun 1, 2021 · 2 revisions

Corporate / Visual Identity

Colors:

color-primary: #00C2FF

color-primary-inverted: #1C272B

color-primary-inverted-2: #2F3C41

color-primary-inverted-text: #FFFFFF

color-background: #EFEFEF

color-background-2: #FFFFFF

color-background-text: #1D1D1F

color-background-cta: #FF6B00

How to use this color schema:

  • color-primary: This is the primary color of our brand. It is used for important elements (e.g headlines)
  • color-primary-inverted: Is the main color complementing the primary color. For example, it can be used for the header/footer.
  • color-primary-inverted-2: This is another color complementing the primary color. It is useful in combination with color-primary-inverted.
  • color-primary-inverted-text: Is the color of all text written on color-primary-inverted or color-primary-inverted-2.
  • color-background: This is the main background color of the website and should therefore be used for the coloring of the background.
  • color-background-2: This is another background color that can be used on the main background color (e.g. for containers).
  • color-background-text: The color of all the text that is either written on color-background or color-background-2
  • color-cta: This is the "call-to-action" color and thus is used for elements like buttons.

Font

  • Font-Settings: font-family: 'Lato', sans-serif; font-style: normal; font-display: swap; font-weight: 400;
  • Font-Size: 1rem

Miscellaneous

  • Border-Radius: 5px