Theme: ← Übersicht Builder Katalog-Verwaltung Tokens

Laufband (Marquee)

Endlos laufendes Band für Logos oder Kurztexte: Richtung und Tempo wählbar, Randabblendung, Pause bei Mauskontakt — hält bei prefers-reduced-motion an

Im Builder nutzen
Blocks v1.0.0 Marketing Website section.marquee

Beispiele

Text-Laufband (Maus darüber pausiert)

Vertrauen uns

Muster GmbHBeispiel AGDemo KGAcme HandelNord LogistikSüd TechnikMuster GmbHBeispiel AGDemo KGAcme HandelNord LogistikSüd Technik
Schnell, andere Richtung
30 Tage RückgabeVersand ab 29 € freiSichere ZahlungSupport aus Deutschland30 Tage RückgabeVersand ab 29 € freiSichere ZahlungSupport aus Deutschland

Eigenschaften

PropTypDefaultBuilder-Label
tonestring: dark | gray | light"light"Ton (Theme liefert die Werte)
titlestring""Überschrift
items *array—Einträge
directionstring: left | right"left"Laufrichtung
speedstring: slow | normal | fast"normal"Tempo
pauseOnHoverbooleantruePause bei Mauskontakt

* Pflicht-Prop

Genutzte Design-Tokens

color.band.darkcolor.band.dark-mutedcolor.band.dark-textcolor.band.graycolor.band.gray-mutedcolor.band.gray-textcolor.text.defaultcolor.text.mutedfont.family.defaultsize.12size.16size.6size.8text.lgtext.smtracking.wide

LLM-Notizen

section.marquee

Endlos laufendes Band für Logos oder Kurztexte (Vertrauens-Leiste, USP-Ticker).

Wichtige Props

  • items* = [{text}] ODER [{imageUrl, alt}] (Logos), tone (dark|gray|light), direction (left|right), speed (slow|normal|fast), pauseOnHover.

Hinweise

  • Der Renderer gibt die Einträge ZWEIMAL aus — so schließt sich die Lücke beim Umlauf nahtlos.
  • Randabblendung per mask-image; bei prefers-reduced-motion steht das Band still und bricht um.