# Separator

A horizontal or vertical dividing line.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<ComponentPreview name="separator/Basic" />

## Import [#import]

```rust
use maccn::MacSeparator;
```

## Usage [#usage]

```rust
// Horizontal (default)
MacSeparator::new("sep-h");

// Vertical
MacSeparator::new("sep-v").axis(Axis::Vertical);
```

## Vertical [#vertical]

<ComponentPreview name="separator/Vertical" />

```rust
use gpui::{Axis, div, px};
use maccn::MacSeparator;

div()
    .flex()
    .items_center()
    .gap_2()
    .h(px(32.))
    .child(div().child("Left"))
    .child(MacSeparator::new("sep-v").axis(Axis::Vertical))
    .child(div().child("Right"))
```

## API [#api]

### Props [#props]

| Prop   | Type   | Default      |
| ------ | ------ | ------------ |
| `axis` | `Axis` | `Horizontal` |