# Steps > An ordered list of the steps of a task with aria-current="step". Page: https://svelte-lean.vercel.app/primitives/steps · Markdown: https://svelte-lean.vercel.app/primitives/steps.md · Index: https://svelte-lean.vercel.app/llms.txt An ordered list that shows where the reader is in a multi-step task, such as a checkout or an onboarding. Tier 0. ```svelte
  1. Cart Completed
  2. Shipping Address and delivery date
  3. Payment Card or invoice
  4. Review
``` Markup and CSS only; it works with page JavaScript disabled. ## Examples ### Wizard ```svelte
    {#each steps as title, i (title)}
  1. {title} {#if i < current}Completed{/if}
    2. {/each}
``` The application owns the index; every step before it gets the complete part. ### Vertical ```svelte
  1. Create the workspace harbor.studio Completed
  2. Invite the team Four people joined Completed
  3. Connect a repository Pull requests appear in the review queue
  4. Plan the first sprint
``` For long titles, descriptions and narrow columns. ### Error state ```svelte
  1. Details Completed
  2. Audience Two fields to fix Has errors
  3. Schedule
  4. Review
``` The error part is read after the title and draws a warning over any other state. ## Usage Plain markup with a stylesheet: install `@svelte-lean/styles`. No JavaScript runs. ```bash npm install @svelte-lean/styles ``` `stylesheets` ```ts import '@svelte-lean/styles/steps.css'; ``` One `
  • ` per step, `aria-current="step"` on the current one, and the `complete` part in every finished step, written in the language of the page. A step that can be revisited holds a link. When the steps navigate a multi-page form, wrap the list in a named `