---
boost: 0
sitemap:
  noindex: true
title: Démonstration de l'Indicateur d'étapes
shortTitle: Design de l'Indicateur d’étapes
description: Illustration du fonctionnement à travers différents cas d’usage et exemples interactifs du composant Indicateur d'étapes.
shortDescription: Suivi d’un parcours en plusieurs étapes
keywords: indicateur d’étapes, stepper, formulaire, démarche, progression, design système, DSFR, navigation, accessibilité
cover: ../_asset/cover/cover.png
excerpt: L’indicateur d’étapes permet à l’usager de se repérer dans un processus linéaire, en affichant la position actuelle dans le parcours ainsi que les étapes restantes.
summary: Ce composant s’intègre dans les parcours à étapes pour aider l’usager à visualiser son avancée. Il affiche une barre de progression, un titre explicite pour chaque étape et un repère numérique. Il ne permet pas de navigation directe entre les étapes mais accompagne visuellement l’usager du début à la fin du formulaire. Sa structure est fixe, sans personnalisation, pour garantir une expérience uniforme et accessible.
mesh:
  - component/input
  - component/form
---

## Indicateur d'étapes

L’indicateur d'étapes est un élément éditorial permettant d’accompagner l’usager au sein d’un formulaire ou une démarche en plusieurs étapes.

:::dsfr-doc-tab-navigation

- [Présentation](../index.md)
- Démo
- [Design](../design/index.md)
- [Code](../code/index.md)
- [Accessibilité](../accessibility/index.md)

:::

::dsfr-doc-storybook{storyId=stepper--docs}