Features 2

Beschreibung:

Der Block Features 2 zeigt Icons in weiß mit einem Hintergrund in Primärfarbe und dazugehörige Texte auf 25% Breite mittig zentriert an.

Einstellungen:

  1. Die Anzahl der Icons kann eingestellt werden (1 (Standard) - 4)
  2. Die Icons können aus der Font-Awesome 5 Bibliothek ausgewählt werden
  3. Jedes Icon kann verlinkt werden
  4. Für jedes Icon kann eine eigene Farbe eingestellt werden
    • Es kann nur dann eine Farbe eingestellt werden, wenn Icons verwendet werden
    • Die Farbe des Icons wechselt zwischen weiß und schwarz je nach Hintergrundfarbe
    • Bei dunklen Hintergründen muss auf eine passende Farbwahl geachtet werden
  5. Anstelle von Icons können auch Bilder ohne Hintergrund angezeigt werden
  6. Es kann optional eine Überschrift angezeigt werden
    • Ist diese aktiviert, kann die Überschriftengröße ausgewählt werden (H2 (Standard), H3, H4)
    • Ist diese aktiviert, kann die Ausrichtung der Überschrift eingestellt werden (links (Standard), zentriert oder rechts)
  7. Bilder können optional ohne Abrundung dargestellt werden (Hat nur dann Auswirkungen, wenn Bilder anstelle von Icons verwendet werden)
  8. Bilder können optional ohne Schatten dargestellt werden (Hat nur dann Auswirkungen, wenn Bilder anstelle von Icons verwendet werden)
  9. Der Hintergrund kann eingestellt werden (Standard (kein Hintergrund), Dunkel, Wellen, Waben)

Beispiele:

Lorem Ipsum

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

Lorem Ipsum 1

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

Lorem Ipsum 2

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

Lorem Ipsum 3

Lorem ipsum dolor sit amet

Lorem Ipsum 4

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

Lorem Ipsum 1

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

Lorem Ipsum 2

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

Lorem Ipsum 3

Lorem ipsum dolor sit amet

Lorem Ipsum 4

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

Beispielbild 2
Lorem Ipsum 1

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

Beispielbild 6
Lorem Ipsum 2

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

Beispielbild 4
Lorem Ipsum 3

Lorem ipsum dolor sit amet

Beispielbild 5
Lorem Ipsum 4

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

"Features 2"-Block mit Überschrift (H2)

Lorem Ipsum 1

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

Lorem Ipsum 2

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

Lorem Ipsum 3

Lorem ipsum dolor sit amet

Lorem Ipsum 4

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

"Features 2"-Block mit Überschrift (H3)

Lorem Ipsum 1

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

Lorem Ipsum 2

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

Lorem Ipsum 3

Lorem ipsum dolor sit amet

Lorem Ipsum 4

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

"Features 2"-Block mit Überschrift (H4)

Lorem Ipsum 1

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

Lorem Ipsum 2

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

Lorem Ipsum 3

Lorem ipsum dolor sit amet

Lorem Ipsum 4

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

Beispielbild 2
Lorem Ipsum 1

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

Beispielbild 6
Lorem Ipsum 2

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

Beispielbild 4
Lorem Ipsum 3

Lorem ipsum dolor sit amet

Beispielbild 5
Lorem Ipsum 4

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

Beispielbild 2
Lorem Ipsum 1

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

Beispielbild 6
Lorem Ipsum 2

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

Beispielbild 4
Lorem Ipsum 3

Lorem ipsum dolor sit amet

Beispielbild 5
Lorem Ipsum 4

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

Dunkler Hintergrund:

Lorem Ipsum 1

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

Lorem Ipsum 2

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

Lorem Ipsum 3

Lorem ipsum dolor sit amet

Lorem Ipsum 4

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

Wellen-Hintergrund:

Lorem Ipsum 1

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

Lorem Ipsum 2

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

Lorem Ipsum 3

Lorem ipsum dolor sit amet

Lorem Ipsum 4

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

Waben-Hintergrund:

Lorem Ipsum 1

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

Lorem Ipsum 2

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

Lorem Ipsum 3

Lorem ipsum dolor sit amet

Lorem Ipsum 4

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