What is a word roller?
A word roller is a vertical list of short words that rolls past a fixed line as the reader scrolls. One word is lit at any moment, the others sit faded above and below it inside a window of a few lines, and a short tagline next to the column completes the sentence: Leather … made by hand, Canvas … made by hand.
It turns a list the reader would skim into one they read, because the scroll hands them the words one at a time.
When to use it
- Offerings — the services or products you make.
- Materials — what things are made of.
- Cities — where you work, ship or play.
- Disciplines — sports, crafts, fields, instruments.
- Values — the words you stand for.
- A menu — dishes, flavours, a tasting order.
How it works
The section is tall — one screen plus a slice of scroll per word — and its stage sticks to the viewport. The list is cloned above and below itself so the column wraps without a gap, and scroll progress sets its position: as the reader scrolls, the words roll up past a fixed line and the word on that line lights up while the rest stay dimmed. With snap on, the column settles on whole words with a half-second ease; with it off, it tracks the scroll exactly. A masked window shows only a few lines, fading at the top and bottom. Clicking a word scrolls to it, and on desktop the reader can grab the list and drag it. One lap over the section brings the start word back to the line. On phones the type is smaller and the two columns sit centred; with reduced motion switched on there is no easing and no drag.
Best practices
- Six to sixteen words, one or two words each, under about 18 characters so nothing wraps.
- Write a tagline that completes every word — made by hand, for every season.
- Ten visible lines read well on a laptop; six on a tight section, fourteen on a tall one.
- Start on a word a third of the way down so the window is full from the first frame.
How to make a word roller — free
Type the words above
One per line, then the tagline that follows every word.Tune the roll
Which word it starts on, how many lines show, the pace, snapping, colours.Embed or download
Copy the embed code or save the self-contained HTML file — or build a whole story in Scrollytelling.
Templates that use a word roller
Want a head start? These ready-made, fully-editable templates put the word roller to work — customize one and publish in minutes.
Word roller — frequently asked questions
Is the word roller widget free?
Yes — customize and export it here with no account.
Does it work on phones?
Yes. The type scales down and the word column and tagline sit centred; the roll follows the scroll the same way.
Can readers drag it?
On a desktop, yes — grabbing the list and dragging rolls it, and the page scroll follows. On phones the scroll itself does the rolling.
How long is the scroll?
One screen plus the pace value per word — at the default 14, fourteen words take about three screens of scrolling, and the list ends on the word it started on.