---
title: Workflows
slug: docs/workflows
docTags: 
createdAt: 2026-06-05T14:56:44.505Z
---

[Workflow](docId\:k4PDPZ_n6XEOQLKItvXwq) blocks present a sequence of steps with numbered indicators. They are useful for installation guides, tutorials, onboarding flows, and any process that should be completed in order.

## Syntax

You can add this component using either Markdown or MDX.

::::Tabs
:::Tab{title="Markdown"}
```markdown
:::::WorkflowBlock
::::WorkflowBlockItem
Step Title

Step content.
::::
:::::
```
:::

:::Tab{title="MDX"}
```javascript
<WorkflowBlock>
  <WorkflowBlockItem>
    Step Title

    Step content.
  </WorkflowBlockItem>
</WorkflowBlock>
```
:::
::::

Each `WorkflowBlockItem` represents a single step in the process. The first line is used as the step title, while the remaining content becomes the step description.

Workflow items can contain standard Markdown formatting, including inline code, lists, links, and other supported components.

## MDX Example

The following example creates a four-step onboarding workflow.

```javascript
<WorkflowBlock>
  <WorkflowBlockItem>
  Install the CLI

  Run `npm install -g @archbee/cli` to install the Archbee CLI globally.
  </WorkflowBlockItem>

  <WorkflowBlockItem>
  Create a project

  Run `archbee new my-docs` to create a new documentation project.
  </WorkflowBlockItem>

  <WorkflowBlockItem>
  Start the dev server

  Run `archbee dev` to start the local preview at `localhost:3000`.
  </WorkflowBlockItem>

  <WorkflowBlockItem>
  Deploy

  Build and deploy your docs to production.
  </WorkflowBlockItem>
</WorkflowBlock>
```