# Shadcn Vertical

> Vertical separator for inline elements.

- Type: example, free and open source (MIT)
- Component: [Separator](https://reui.io/components/separator.md)
- Page: https://reui.io/components/separator/c-separator-2
- Docs (Base UI): https://ui.shadcn.com/docs/components/base/separator.md
- Docs (Radix UI): https://ui.shadcn.com/docs/components/radix/separator.md
- MCP: `get_example("c-separator-2")`
- Registry item: https://reui.io/r/styles/base-nova/c-separator-2.json
- Uses: Separator

## Best for

A single line of 3 one word labels, Blog, Docs and Source, split by 2 rules as tall as the row

## Agent notes

- Blog, Docs and Source are plain `div` text, not links; wrap each in an anchor with a real target before using the row as navigation

## When not to use

- Side by side entries that each stack a title over a caption: use [Grouped Menu Items](https://reui.io/components/separator/c-separator-3.md) (`get_example("c-separator-3")`)

## Install

```bash
npx shadcn@latest add @reui/c-separator-2
```

## About Shadcn Separator

### When to use

- Thin rules between a heading and its body, or between the stacked rows of a list or a summary
- Vertical rules between inline labels or side by side menu entries along one row
- Labeled breaks with a short caption centered on the rule, like an or continue with line

### When not to use

- A trail of links from the current page back up to its parent pages: use [Breadcrumb](https://reui.io/components/breadcrumb.md) (`get_component("breadcrumb")`)
- Step lines and named phase breaks in an agent run log or transcript: use [Marker](https://reui.io/components/marker.md) (`get_component("marker")`)
- A list of rows each led by an avatar or icon, with text and an action: use [Item](https://reui.io/components/item.md) (`get_component("item")`)

### Agent notes

- The base `Separator` renders role separator, while the radix twin defaults `decorative` to true and renders role none, hidden from screen readers
- A vertical `Separator` takes its height from `self-stretch`, so it shows only in a flex row or grid unless given a height such as `h-8`

Every ReUI item has a twin like this one; the index is https://reui.io/llms.txt. Agents with the ReUI MCP (https://reui.io/docs/mcp) get the same guidance from the getters named above.