Slider - Flowboard

What it is

Slider groups several pages into one swipeable sequence. It is the main component for carousels, onboarding steps, and story-like screens.

What it’s best for

Use it when users should move through related content one page at a time.

When to use it

Build a multi-step onboarding carousel
Show testimonials or plan highlights
Tell a before-and-after story
Break a long explanation into shorter pages

When not to use it

Do not use it for a single page. A Stack is simpler.
Do not overload a slider with too many pages. If the story becomes long, split it into clearer screens.

How to add it in the dashboard

Open the screen in the dashboard.
Add Slider from the Components panel.
Select the slider on the canvas.
In the properties panel, choose direction, page spacing, and size.
Add or duplicate slider pages, then edit each page on the canvas.
Pair it with Page Indicator if users need progress cues.

Key parameters

Parameter	What it changes	When to adjust it
Direction	Switches between horizontal and vertical swiping	Use it to match the story or design pattern
Width and height mode	Sets whether the slider fills space or uses fixed sizing	Change it when the slider should act like a hero area or a compact section
Page alignment	Aligns each page within the slider frame	Use it when pages feel visually off
Page spacing	Adds space between pages	Use it to create a lighter carousel feel
Page peek	Shows part of the next or previous page	Use it when you want to signal that more content exists
Looping	Restarts the slider after the last page	Use it for evergreen showcase content
Auto-advance	Moves pages automatically	Use it for guided storytelling or passive previews
Auto-advance interval	Controls how quickly pages change	Adjust it when content needs more or less reading time
Page control position	Places the built-in progress cue higher or lower	Use it to fit around the rest of the layout

Example use cases

A three-page onboarding flow that introduces the product value, shows proof, and ends with a trial CTA
A paywall story that walks through benefits one page at a time
A carousel of customer quotes with product screenshots

Best practices

Keep each page focused on one idea.
Use short headlines so swiping feels fast and clear.
Pair the slider with a Page Indicator when there are multiple steps.
If you enable auto-advance, make sure users still have enough time to read.

Common mistakes

Putting too much copy on each page
Hiding that the content is swipeable
Using too many pages for a simple message