domains / families / design / scroll-progress-timeline

scroll-progress-timeline

separate

Turn any ordered process into a data-driven vertical or horizontal scroll story with a base line, progress fill, active step states, responsive collapse, semantic fallback, and reduced-motion behavior. Use for onboarding, checkout, roadmaps, recipes, case studies, service processes, histories, or narratives where progress through the sequence should become visible while scrolling.

When to use

• onboarding
• checkout
• roadmaps
• recipes
• case studies
• service processes
• histories
• narratives

Skill page

Source