ticker scroll marquee announcement promo press infinite-scroll banner ticker marquee scroll announcement infinite loop promo press-mentions scrolling ticker announcement bar infinite marquee text strip horizontal scrolling promo banner
Announcement Ticker Scroll
Fetch pattern JSON:
curl https://webspire.de/patterns/announcement/ticker-scroll.json ticker-scroll.html
Details
Responsive Dark Mode SSR Safe Copy & Paste
Stable Published
tickerscrollmarqueeannouncementpromopressinfinite-scrollbanner
Slots
| Name | Required | Description |
|---|---|---|
| ticker-items | Yes | Text items separated by bullet separators. Duplicated for seamless loop. |
Props
| Name | Type | Default | Description |
|---|---|---|---|
| speed | string | 20s | CSS animation duration. Shorter = faster. |
| variant | 'dark' | 'light' | dark | Background color variant of the strip. |
Infinitely scrolling horizontal ticker strip powered by a CSS @keyframes animation. Items are duplicated twice so the loop is seamless. Hovering pauses the animation. Includes a dark (accent) and a light (secondary bg) variant. Animation respects prefers-reduced-motion.