Back to componentsSections / Workflow Rail

LIVE PREVIEWYour changes update liveLocal renderer

Tweaks

Workflow Rail settings

Accessible section label

Pattern

Card theme

Initially open card

Animate Prism gradient

Card 1: Discover

Title

Resting description

Expanded description

Example panel title

Image description

Details, one per line (1–3)

Example line 1

Example line 2

Example line 3

Colour 1

Colour 2

Colour 3

Local image path (optional)

Images must already exist in the page assets. Without an image, the example panel is shown.

Card 2: Plan

Title

Resting description

Expanded description

Example panel title

Image description

Details, one per line (1–3)

Example line 1

Example line 2

Example line 3

Colour 1

Colour 2

Colour 3

Local image path (optional)

Images must already exist in the page assets. Without an image, the example panel is shown.

Card 3: Create

Title

Resting description

Expanded description

Example panel title

Image description

Details, one per line (1–3)

Example line 1

Example line 2

Example line 3

Colour 1

Colour 2

Colour 3

Local image path (optional)

Images must already exist in the page assets. Without an image, the example panel is shown.

Card 4: Review

Title

Resting description

Expanded description

Example panel title

Image description

Details, one per line (1–3)

Example line 1

Example line 2

Example line 3

Colour 1

Colour 2

Colour 3

Local image path (optional)

Images must already exist in the page assets. Without an image, the example panel is shown.

Your settings travel with the component.
Preview size and pause stay here.

COMPONENT Pro

Workflow Rail

Four expanding process cards with connected silhouettes and colour blooms.

Workflow Rail v2.0.2

Checking your Pro access… You can preview and customize while we check.

Package 2.0.2 · Independent componentPro component

Install & usageReact component

API reference61 properties

Usage notesComponent documentation

Rendering & accessibilityLocal renderer