Styleguide

Headlines

Ich bin eine Headline h1 (.fst--h1)

Ich bin eine Headline h2 (.fst--h2)

Ich bin eine Headline h3 (.fst--h3)

Ich bin eine Headline h4 (.fst--h4)

Ich bin eine Headline h5 (.fst--h5)

Ich bin eine Headline h6 (.fst--h6)

Accent

Unser Auftrag accent-hero (.fst--accent-hero)

Unser Auftrag accent-l (.fst--accent-l)

Unser Auftrag accent (.fst--accent)

Unser Auftrag accent-s (.fst--accent-s)

Bodytext

Ich bin ein base-xl (.fst--base-xl)

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy aliquyam

erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.

Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consetetur sadipscing
At vero eos et accusam et justo

Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consetetur sadipscing
At vero eos et accusam et justo

Sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliq This is a link

with a long text. duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata

sanctus est Lorem ipsum dolor sit amet.

Ich bin ein base-l (.fst--base-l)

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy aliquyam

erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.

Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consetetur sadipscing
At vero eos et accusam et justo

Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consetetur sadipscing
At vero eos et accusam et justo

Sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliq This is a link

with a long text. duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata

sanctus est Lorem ipsum dolor sit amet.

Ich bin ein base (.fst--base)

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy aliquyam

erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.

Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consetetur sadipscing
At vero eos et accusam et justo

Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consetetur sadipscing
At vero eos et accusam et justo

Sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliq This is a link

with a long text. duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata

sanctus est Lorem ipsum dolor sit amet.

Ich bin ein base-s (.fst--base-s)

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy aliquyam

erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.

Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consetetur sadipscing
At vero eos et accusam et justo

Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consetetur sadipscing
At vero eos et accusam et justo

Sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliq This is a link

with a long text. duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata

sanctus est Lorem ipsum dolor sit amet.

Ich bin ein base-xs (.fst--base-xs)

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy aliquyam

erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.

Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consetetur sadipscing
At vero eos et accusam et justo

Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consetetur sadipscing
At vero eos et accusam et justo

Sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliq This is a link

with a long text. duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata

sanctus est Lorem ipsum dolor sit amet.

Ich bin ein caption (.fst--caption)

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy aliquyam

erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.

Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consetetur sadipscing
At vero eos et accusam et justo

Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consetetur sadipscing
At vero eos et accusam et justo

Sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliq This is a link

with a long text. duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata

sanctus est Lorem ipsum dolor sit amet.

Quote

Wir arbeiten in Österreich, Europa und internationalen Schwerpunktländern. (.fst--quote)

Icons

global

16x16px

24x24px

32x32px

60x60px

socials

16x16px

32x32px

Buttons Default

Aktuelle Bewerbungsfristen Button secondary

Aktuelle Bewerbungsfristen (Block) Button secondary (Block)

Button primary with super long text which can easily break into a new line on mobile Button secondary with super long text which can easily break into a new line on mobile

Buttons Dark

Aktuelle Bewerbungsfristen Button secondary

Aktuelle Bewerbungsfristen (Block) Button secondary (Block)

Button primary with super long text which can easily break into a new line on mobile Button secondary with super long text which can easily break into a new line on mobile

Link Text Default

Aktuelle Bewerbungsfristen

Link with super long text which can easily break into a new line on mobile

Aktuelle Bewerbungsfristen

Link Text Dark

Aktuelle Bewerbungsfristen

Link with super long text which can easily break into a new line on mobile

Aktuelle Bewerbungsfristen

Back Link Default

Zur Übersicht

Link with super long text which can easily break into a new line on mobile

Aktuelle Bewerbungsfristen (disabled)

Back Link Dark

Zur Übersicht

Link with super long text which can easily break into a new line on mobile

Aktuelle Bewerbungsfristen (disabled)

Control Icon Default

Control Icon Dark

Tag Default

This is a tag This is a tag with an icon Aktuelle Bewerbungsfristen

This is an error tag This is a warning tag This is a success tag

Link with super long text which can easily break into a new line on mobile

Aktuelle Bewerbungsfristen

Tag Dark

This is a tag This is a tag with an icon Aktuelle Bewerbungsfristen

This is an error tag This is a warning tag This is a success tag

Link with super long text which can easily break into a new line on mobile

Aktuelle Bewerbungsfristen

Avatar Default

Max Mustermann

Avatar Dark

Max Mustermann

Colors

.color--primary

.color--default

.color--invert

.color--primary

.color--default

.color--invert

Backgrounds

.bg--primary

.bg--default

.bg--lightest

.bg--light

.bg--dark

.bg--darkest

Link Panel

This is a link panel

This is a description

Aktuelle Bewerbungsfristen

This is a description

This is a link panel

Aktuelle Bewerbungsfristen

This is a description

Aktuelle Bewerbungsfristen

This is a description

Aktuelle Bewerbungsfristen

This is a description

Aktuelle Bewerbungsfristen

This is a description

Quicklink

This is a link panel

Aktuelle Bewerbungsfristen

Mehr

This is a link panel

Aktuelle Bewerbungsfristen

News Item

Test Another tag

This is a news item

Test Another tag

Aktuelle Bewerbungsfristen

Lorem ipsum dolor sit amet consectetur adipiscing elit, euismod porttitor lacus consequat parturient aliquam. Feugiat eros blandit mi egestas ut, hendrerit natoque donec suspendisse et, sagittis phasellus ante nascetur. Maecenas ullamcorper dignissim non class tortor habitasse aenean venenatis felis quis volutpat, platea quam rhoncus id pulvinar ligula sociis laoreet pellentesque.

5 min lesen · 05. Dezember 2025

Test Another tag