Logos

Normal

Inverted

Normal

Inverted

Grid

col-12
col-6
col-6
col-4
col-4
col-4
col-3
col-3
col-3
col-3
col-6 center
col-8 center
col-10 center
col-6 offset / right
col-6

Headings

font-family: Suisse-Intl-B', sans-serif;

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Special Headings

My Special Heading (Default)

My Special Heading (Children)

My Special Heading (Frish)

My Special Heading (Youth work)

My Special Heading (School)

Fonts

  • font-family: 'Suisse-Intl'
  • font-family: 'Suisse-Intl-M'
  • font-family: 'Suisse-Intl-SemiBold-M'
  • font-family: 'Suisse-Intl-B'
  • font-family: 'Suisse-Intl-I'

border-radius

  • Normal (8px)
  • Large (16px)
  • XL (24px)

Text

font-family: Suisse-Intl,sans-serif;

Sed sunt anim aute. Anim aute non consequat occaecat esse eiusmod, aliquip. Consequat occaecat esse eiusmod aliquip. Esse eiusmod, aliquip excepteur consectetur excepteur exercitation. Excepteur consectetur excepteur exercitation sed, fugiat. Exercitation sed fugiat cupidatat eu sunt. Fugiat cupidatat eu sunt consectetur.

  • Ut qui consequat velit ad
  • Ut qui consequat velit ad
  • Ut qui consequat velit ad
  • Ut qui consequat velit ad
  • Ut qui consequat velit ad

Sed sunt anim aute. Anim aute non consequat occaecat esse eiusmod, aliquip. Consequat occaecat esse eiusmod aliquip. Esse eiusmod, aliquip excepteur consectetur excepteur exercitation. Excepteur consectetur excepteur exercitation sed, fugiat. Exercitation sed fugiat cupidatat eu sunt. Fugiat cupidatat eu sunt consectetur.

  1. Ut qui consequat velit ad
  2. Ut qui consequat velit ad
  3. Ut qui consequat velit ad
  4. Ut qui consequat velit ad
  5. Ut qui consequat velit ad

Sed sunt anim aute. Anim aute non consequat occaecat esse eiusmod, aliquip. Consequat occaecat esse eiusmod aliquip. Esse eiusmod, aliquip excepteur consectetur excepteur exercitation. Excepteur consectetur excepteur exercitation sed, fugiat. Exercitation sed fugiat cupidatat eu sunt. Fugiat cupidatat eu sunt consectetur.

  • Dolore mollit amet veniam sunt minim magna. Amet veniam, sunt minim magna pariatur. Minim magna pariatur cupidatat aliqua. Pariatur cupidatat aliqua do cupidatat culpa. Aliqua do cupidatat culpa esse enim amet. Cupidatat culpa esse enim amet elit. Esse enim amet elit esse dolore sed. Amet elit esse dolore sed officia.
  • Dies
  • Dies
  • Dies
  • Dies
  • Dolore mollit amet veniam sunt minim magna. Amet veniam, sunt minim magna pariatur. Minim magna pariatur cupidatat aliqua. Pariatur cupidatat aliqua do cupidatat culpa. Aliqua do cupidatat culpa esse enim amet. Cupidatat culpa esse enim amet elit. Esse enim amet elit esse dolore sed. Amet elit esse dolore sed officia.
  • Dies
  • Dies
  • Dies
  • Dies
  • Dolore mollit amet veniam sunt minim magna. Amet veniam, sunt minim magna pariatur. Minim magna pariatur cupidatat aliqua. Pariatur cupidatat aliqua do cupidatat culpa. Aliqua do cupidatat culpa esse enim amet. Cupidatat culpa esse enim amet elit. Esse enim amet elit esse dolore sed. Amet elit esse dolore sed officia.
  • Dies
  • Dies
  • Dies
  • Dies

Zielgruppen

Kinder
Jugend
Erwachsene
Schule

Buttons

Normal

Small

Colors

Figma: Link

red-50
red-100
red-200
red-300
red-400
red-500
red-600
red-700
red-800
red-900
red-950
red-1000
yellow-50
yellow-100
yellow-200
yellow-300
yellow-400
yellow-500
yellow-600
yellow-700
yellow-800
yellow-900
yellow-950
yellow-1000
blue-50
blue-100
blue-200
blue-300
blue-400
blue-500
blue-600
blue-700
blue-800
blue-900
blue-950
blue-1000
green-50
green-100
green-200
green-300
green-400
green-500
green-600
green-700
green-800
green-900
green-950
green-1000
orange-50
orange-100
orange-200
orange-300
orange-400
orange-500
orange-600
orange-700
orange-800
orange-900
orange-950
orange-1000
cyan-50
cyan-100
cyan-200
cyan-300
cyan-400
cyan-500
cyan-600
cyan-700
cyan-800
cyan-900
cyan-950
cyan-1000
gray-50
gray-100
gray-200
gray-300
gray-400
gray-500
gray-600
gray-700
gray-800
gray-900
gray-950
gray-1000

Icons

color: currentColor

color: primary

inverted

forms

We'll never share your email with anyone else.