Timeline

Where you can add it

Not in section groups: Header, Footer, Overlays.

Blocks

Milestone — part of this section

Up to 12 blocks.

Milestone

Setting	Type	Default	Options and range
Label A year, a step or a season. Keep it short — it is set large.	Text	2024
Heading	Text	Milestone heading
Text	Inline rich text	Tell the story of this step in a sentence or two.
Image	Image	—
Link	Link	—
Link label Leave empty to use “Learn more”.	Text	—

Settings

Setting	Type	Default	Options and range
Heading
Eyebrow	Text	Timeline
Heading Make a word italic to emphasize it.	Inline rich text	Our story
Heading size	Select	Medium	Small Medium Large Extra large
Text	Inline rich text	Tell the story of your brand, a process or a routine, one milestone at a time.
Milestones
Layout on desktop The layout on screens 990 px and wider. Tablets and phones have their own layouts below.	Select	Alternating	Alternating One side Horizontal track Numbered steps
Layout on tablet	Select	One side	One side Alternating Horizontal track Numbered steps
Layout on mobile	Select	One side	One side Horizontal track
Label style Numbered counts the milestones (01, 02…) and moves each label above its heading.	Select	As typed	As typed Numbered
Label size	Select	Large	Large Medium Small
Draw the line on scroll Off shows the whole line from the start. The dots still fill as visitors reach them.	Checkbox	On
Aspect ratio	Select	Landscape (3:2)	Landscape (3:2) Portrait (4:5) Square (1:1)
Highlight color Fills the dots and the heading’s highlight. Leave empty to use the section’s own color.	Color	—
Settings every section has — Layout, spacing, motion and visibility — the same in every section. Defaults here: Top spacing 104 px (everywhere else: 64 px); Bottom spacing 104 px (everywhere else: 64 px); Top spacing on mobile 56 px (everywhere else: 40 px); Bottom spacing on mobile 56 px (everywhere else: 40 px); Stagger 80 ms (everywhere else: 0 ms).

Presets

Timeline — Category: Storytelling
Starts with: Milestone, Milestone, Milestone