Weiß / Standard (section--white)

Preline / Überschrift

Header Only – Kontrast-Check in Section

Text mit Emphasis

Regular Text – Zwischenüberschrift mit emphasis

Fließtext mit Link im Absatz und weiterem Inhalt zum Lesbarkeitstest in farbigen Sektionen.

  • Unordered item eins
  • Unordered item zwei
  1. OL 1 — Markenfarbe dark-green
  2. OL 2 — Markenfarbe light-green (Teal)
  3. OL 3 — Markenfarbe neon (Akzent)
  4. OL 4 — wieder dark-green
  5. OL 5 — wieder light-green

Highlight-Text: Fett und emphasis – Kontrast prüfen.

Caption Medien-Text

Preline

Text & Media Modul

Beschreibung und Lesbarkeit auf dunklem bzw. hellem Section-Hintergrund.
Button
Bildunterschrift (Images Only)

Blockquote: Zitattext für Kontrast in farbiger Sektion.

Quellenangabe
Primary Secondary
Accordion 1 von 3 (Weiß / Standard (section--white))
Accordion-Inhalt 1 — Trennlinien zwischen den Panels prüfen.
Accordion 2 von 3 (Weiß / Standard (section--white))
Accordion-Inhalt 2
Accordion 3 von 3 (Weiß / Standard (section--white)) — letztes Panel (unterer Rand)
Accordion-Inhalt 3
↓

Antwort 1 — Separator zwischen FAQ-Modulen prüfen.

↓

Antwort 2

↓

Antwort 3

Label
Kontakt Name
Kurzbeschreibung Kontakt.

Dateiliste (uploads)

Topic teaser

  1. Topic-Titel (Weiß / Standard (section--white))
    Teaser-Text für Kontrast in farbiger Section.
    Zum Thema
Colored box

Hervorhebung mit light-green Hintergrund — Lesbarkeit in Section prüfen.

Page-teaser Spalte 1

Page teaser Spalte 1

Kurzbeschreibung wie page_teaser_item.
Weiter

Page teaser Spalte 2

Zweite Kachel.
Weiter

Keyvisual + Text

Drei Keyvisuals + Fließtext — Kontrast (Weiß / Standard (section--white))

Aktion

Video stage (Poster)

Link

Slider box 1

Erste Karte im Container.

Slider box 2

Zweite Karte — Abstände prüfen.
  • Project in focus
Projekt mit Bild
Kurztext Slider „Projects in focus“.
Mehr erfahren
Galerie — eine Folie
Mit Bild
Contact box
Zweites Kontakt-Beispiel mit contacts--show-images.

Hellgrün (section--light-green)

Preline / Überschrift

Header Only – Kontrast-Check in Section

Text mit Emphasis

Regular Text – Zwischenüberschrift mit emphasis

Fließtext mit Link im Absatz und weiterem Inhalt zum Lesbarkeitstest in farbigen Sektionen.

  • Unordered item eins
  • Unordered item zwei
  1. OL 1 — Markenfarbe dark-green
  2. OL 2 — Markenfarbe light-green (Teal)
  3. OL 3 — Markenfarbe neon (Akzent)
  4. OL 4 — wieder dark-green
  5. OL 5 — wieder light-green

Highlight-Text: Fett und emphasis – Kontrast prüfen.

Caption Medien-Text

Preline

Text & Media Modul

Beschreibung und Lesbarkeit auf dunklem bzw. hellem Section-Hintergrund.
Button
Bildunterschrift (Images Only)

Blockquote: Zitattext für Kontrast in farbiger Sektion.

Quellenangabe
Primary Secondary
Accordion 1 von 3 (Hellgrün (section--light-green))
Accordion-Inhalt 1 — Trennlinien zwischen den Panels prüfen.
Accordion 2 von 3 (Hellgrün (section--light-green))
Accordion-Inhalt 2
Accordion 3 von 3 (Hellgrün (section--light-green)) — letztes Panel (unterer Rand)
Accordion-Inhalt 3
↓

Antwort 1 — Separator zwischen FAQ-Modulen prüfen.

↓

Antwort 2

↓

Antwort 3

Label
Kontakt Name
Kurzbeschreibung Kontakt.

Dateiliste (uploads)

Topic teaser

  1. Topic-Titel (Hellgrün (section--light-green))
    Teaser-Text für Kontrast in farbiger Section.
    Zum Thema
Colored box

Hervorhebung mit light-green Hintergrund — Lesbarkeit in Section prüfen.

Page-teaser Spalte 1

Page teaser Spalte 1

Kurzbeschreibung wie page_teaser_item.
Weiter

Page teaser Spalte 2

Zweite Kachel.
Weiter

Keyvisual + Text

Drei Keyvisuals + Fließtext — Kontrast (Hellgrün (section--light-green))

Aktion

Video stage (Poster)

Link

Slider box 1

Erste Karte im Container.

Slider box 2

Zweite Karte — Abstände prüfen.
  • Project in focus
Projekt mit Bild
Kurztext Slider „Projects in focus“.
Mehr erfahren
Galerie — eine Folie
Mit Bild
Contact box
Zweites Kontakt-Beispiel mit contacts--show-images.

Dunkelgrün (section--dark-green)

Preline / Überschrift

Header Only – Kontrast-Check in Section

Text mit Emphasis

Regular Text – Zwischenüberschrift mit emphasis

Fließtext mit Link im Absatz und weiterem Inhalt zum Lesbarkeitstest in farbigen Sektionen.

  • Unordered item eins
  • Unordered item zwei
  1. OL 1 — Markenfarbe dark-green
  2. OL 2 — Markenfarbe light-green (Teal)
  3. OL 3 — Markenfarbe neon (Akzent)
  4. OL 4 — wieder dark-green
  5. OL 5 — wieder light-green

Highlight-Text: Fett und emphasis – Kontrast prüfen.

Caption Medien-Text

Preline

Text & Media Modul

Beschreibung und Lesbarkeit auf dunklem bzw. hellem Section-Hintergrund.
Button
Bildunterschrift (Images Only)

Blockquote: Zitattext für Kontrast in farbiger Sektion.

Quellenangabe
Primary Secondary
Accordion 1 von 3 (Dunkelgrün (section--dark-green))
Accordion-Inhalt 1 — Trennlinien zwischen den Panels prüfen.
Accordion 2 von 3 (Dunkelgrün (section--dark-green))
Accordion-Inhalt 2
Accordion 3 von 3 (Dunkelgrün (section--dark-green)) — letztes Panel (unterer Rand)
Accordion-Inhalt 3
↓

Antwort 1 — Separator zwischen FAQ-Modulen prüfen.

↓

Antwort 2

↓

Antwort 3

Label
Kontakt Name
Kurzbeschreibung Kontakt.

Dateiliste (uploads)

Topic teaser

  1. Topic-Titel (Dunkelgrün (section--dark-green))
    Teaser-Text für Kontrast in farbiger Section.
    Zum Thema
Colored box

Hervorhebung mit light-green Hintergrund — Lesbarkeit in Section prüfen.

Page-teaser Spalte 1

Page teaser Spalte 1

Kurzbeschreibung wie page_teaser_item.
Weiter

Page teaser Spalte 2

Zweite Kachel.
Weiter

Keyvisual + Text

Drei Keyvisuals + Fließtext — Kontrast (Dunkelgrün (section--dark-green))

Aktion

Video stage (Poster)

Link

Slider box 1

Erste Karte im Container.

Slider box 2

Zweite Karte — Abstände prüfen.
  • Project in focus
Projekt mit Bild
Kurztext Slider „Projects in focus“.
Mehr erfahren
Galerie — eine Folie
Mit Bild
Contact box
Zweites Kontakt-Beispiel mit contacts--show-images.