Skip to main content

Scrolling ticker block

What is the Scrolling ticker block for?

Short words in continuous motion. The Scrolling ticker scrolls the words or short phrases you give it along a band, without stopping. It suits a list of services, topics, brand values or an event's keywords, and on a longer page it adds visual rhythm between two sections.

Motion draws attention but is hard to read. So do not put anything in it that visitors must read, such as a price, a deadline or contact details. Those belong in static text.

Live example

Slow speed, medium text size, star separator, on an inverted band, with an icon pause button:

  • Website building
  • Your own domain
  • Multilingual site
  • News and events
  • AI copywriting
  • Mobile-friendly

Visitors can pause it. The row stops when a visitor hovers over it or taps it, and a keyboard user gets a pause button that appears on focus. For visitors who ask their device for less motion, it stands still from the start. The Pause button makes this visible: without it, nothing tells visitors they can stop the row, so it is worth leaving on.

What can you set on a Scrolling ticker?

Eight settings decide how prominent and how readable the row is.

Speed

Slow, normal or fast. Longer phrases read better at a slower speed.

Direction

Scrolls to the left or to the right. Two rows in opposite directions, one above the other, feel playful.

Text size

Small, medium or large. Large makes a striking divider band, small a quiet list.

Separator

Star, dot, slash, dash, diamond, heart, arrow, an icon of your choice, or nothing between the words.

Pause button

An icon on the row, text under the row, or none. Without it, visitors do not know they can pause it.

Links on the words

Each word can have an optional link, for example to the page of the service it names.

Strip

None or Accent colour: the row runs on a strip in the accent colour. If the block has a background of its own, that background wins.

Slant

Straight, Up to the right or Down to the right. A slanted row works best as a divider between two sections.

Scrolling ticker settings in the sidebar: speed, direction, text size, an icon separator and an icon pause button, with the list of words and optional URLs below. On the right, the words scroll on a dark band with sparkle icons between them.
You enter the words and their links in a draggable list in the sidebar.

MOTION, IN MODERATION

One scrolling ticker per page is plenty.

Short words, a calm speed and a visible pause button: that way the motion adds rhythm without pulling attention away.