LogoPicGo Docs
LogoPicGo Docs
Homepage

Introduction

Quick StartWhat is FumadocsComparisons

Setup

Manual InstallationStatic Export

Writing

MarkdownInternationalization

UI

OverviewThemesSearch
Components
MDX

Steps

Adding steps to your docs

Buy Coffee

Some text here

Go to Office Some text here

Some text here

Have a meeting Some text here

Some text here

Usage

Put your steps into the Steps container.

import { Step, Steps } from 'fumadocs-ui/components/steps';

<Steps>
<Step>

### Hello World

</Step>

<Step>

### Hello World

</Step>
</Steps>

We recommend using Tailwind CSS utility classes directly on Tailwind CSS projects.

Without imports

You can use the Tailwind CSS utilities without importing it.

<div className="fd-steps">
  <div className="fd-step" />
</div>

It supports adding step styles to only headings with arbitrary variants.

<div className='fd-steps [&_h3]:fd-step'>

### Hello World

</div>

Hello World

You no longer need to use the step component anymore.

Table of Contents

Usage
Without imports
Hello World