Skip to content
Starlight Nova

Steps

To style a numbered list of tasks to create step-by-step guides, use the <Steps> component.

Preview

Section titled “Preview”

  1. Import the component into your MDX file:

    import { Steps } from '@astrojs/starlight/components'

  2. Wrap <Steps> around your ordered list items.

Usage

Section titled “Usage”
import { Steps } from '@astrojs/starlight/components'

<Steps>

1. Import the component into your MDX file:

   ```js
   import { Steps } from '@astrojs/starlight/components'
   ```

2. Wrap `<Steps>` around your ordered list items.

</Steps>

<Steps> Props

Section titled “<Steps> Props”

The <Steps> component does not accept any props.