Typography

Font-Faces

Body Font (bold/strong)
 CODE

neue-haas-grotesk-display
500 (Roman)
The sky was cloudless and of a deep dark blue. Then came the night of the first falling star. Waves flung themselves at the blue evening. !#$%&()*+,-./ 0123456789 :;<=>?@

Body Font
 CODE

neue-haas-grotesk-display
300 (ExtraLight)
The sky was cloudless and of a deep dark blue. Then came the night of the first falling star. Waves flung themselves at the blue evening. !#$%&()*+,-./ 0123456789 :;<=>?@

Headline Font (H2 und kleiner)
 CODE

neue-haas-grotesk-display
300 (ExtraLight)
The sky was cloudless and of a deep dark blue. Then came the night of the first falling star. Waves flung themselves at the blue evening. !#$%&()*+,-./ 0123456789 :;<=>?@

Headline Font (H1)
 CODE

neue-haas-grotesk-display
300 (ExtraLight)
The sky was cloudless and of a deep dark blue. Then came the night of the first falling star. Waves flung themselves at the blue evening. !#$%&()*+,-./ 0123456789 :;<=>?@

Font of OffCanvas-Menue
 CODE

neue-haas-grotesk-display
200 (Thin)
The sky was cloudless and of a deep dark blue. Then came the night of the first falling star. Waves flung themselves at the blue evening. !#$%&()*+,-./ 0123456789 :;<=>?@

Font-Sizes

FS-XXXXL
 CODE

ABCabc123,.-@&€
font-size: 112px; font-family: var(--headline-font-h1-1); font-style: var(--headline-font-h1-2); font-weight: var(--headline-font-h1-3);

FS-XXXL
 CODE

ABCabc123,.-@&€
font-size: 72px; font-family: var(--headline-font-h1-1); font-style: var(--headline-font-h1-2); font-weight: var(--headline-font-h1-3);

FS-XXL
 CODE

ABCabc123,.-@&€
font-size: 52px; font-family: var(--headline-font-h1-1); font-style: var(--headline-font-h1-2); font-weight: var(--headline-font-h1-3);

FS-XL
 CODE

ABCabc123,.-@&€
font-size: 38px; font-family: var(--headline-font-h1-1); font-style: var(--headline-font-h1-2); font-weight: var(--headline-font-h1-3);

FS-LL
 CODE

ABCabc123,.-@&€
font-size: 30px; font-family: var(--body-font-1); font-style: var(--body-font-2); font-weight: var(--body-font-3);

FS-L
 CODE

ABCabc123,.-@&€
font-size: 24px; font-family: var(--body-font-1); font-style: var(--body-font-2); font-weight: var(--body-font-3);

FS-M
 CODE

ABCabc123,.-@&€
font-size: 20px; font-family: var(--body-font-1); font-style: var(--body-font-2); font-weight: var(--body-font-3);

FS-S
 CODE

ABCabc123,.-@&€
font-size: 18px; font-family: var(--body-font-1); font-style: var(--body-font-2); font-weight: var(--body-font-3);

FS-XS
 CODE

ABCabc123,.-@&€
font-size: 16px; font-family: var(--headline-font-h1-1); font-style: var(--headline-font-h1-2); font-weight: var(--headline-font-h1-3);

FS-XXS
 CODE

ABCabc123,.-@&€
font-size: 14px; font-family: var(--headline-font-h1-1); font-style: var(--headline-font-h1-2); font-weight: var(--headline-font-h1-3);

FS-XXXS
 CODE

ABCabc123,.-@&€
font-size: 12px; font-family: var(--headline-font-h1-1); font-style: var(--headline-font-h1-2); font-weight: var(--headline-font-h1-3);