# Stepper

> An animated step indicator fills as you advance — clear progress for a multi-step flow (checkout, onboarding). One per flow. Under prefers-reduced-motion fills without easing.

- Skill: `nexu-io/stepper` (Agent Skill, multi-file: 5 files)
- Install (CLI): `npx skillmds@latest add nexu-io/stepper`
- Raw SKILL.md: https://api.skillmd.com/api/skills/nexu-io/stepper/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Coding & Dev Tools
- Author: Nexu (https://skillmd.com/u/nexu-io)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/nexu-io/stepper

---

# stepper
Stepper Dependency-free, reduced-motion safe.
## How to apply
Copy css+js; `<div class="stepper" data-step="2"><div class="st">1</div><div class="bar"></div><div class="st">2</div>…</div>`. Click to advance (demo).