# Separator: Decorative

> `decorative` hides a purely visual line from screen readers, so they don't announce a separator between rows that already read well on their own.

Example: https://hextaui.com/docs/separator/examples/decorative
Component docs: https://hextaui.com/docs/separator.md

## Add this example

```bash
npx shadcn@latest add https://hextaui.com/r/separator-decorative.json
```

This adds `components/examples/separator/decorative.tsx` with the Separator component and the HextaUI theme tokens.

## Source

```tsx title="components/examples/separator/decorative.tsx"
import { Separator } from "@/components/ui/separator"

export function SeparatorDecorative() {
  return (
    <div className="flex w-full max-w-xs flex-col gap-3 rounded-xl border p-4 text-sm">
      <div className="flex items-center justify-between">
        <span className="text-muted-foreground">Subtotal</span>
        <span className="tabular-nums">$48.00</span>
      </div>
      <div className="flex items-center justify-between">
        <span className="text-muted-foreground">Shipping</span>
        <span className="tabular-nums">$4.00</span>
      </div>
      <Separator decorative />
      <div className="flex items-center justify-between font-medium">
        <span>Total</span>
        <span className="tabular-nums">$52.00</span>
      </div>
    </div>
  )
}
```

## Props in this example

### Separator

| Prop | Type | Default | Description |
| --- | --- | --- | --- |
| `decorative` | `boolean` | `false` | Hide the line from screen readers when it is only visual. |

## More Separator examples

- [Vertical](https://hextaui.com/docs/separator/examples/vertical.md)
- [Label](https://hextaui.com/docs/separator/examples/label.md)
- [Align](https://hextaui.com/docs/separator/examples/align.md)
- [Vertical label](https://hextaui.com/docs/separator/examples/vertical-label.md)
- [Inline](https://hextaui.com/docs/separator/examples/render.md)
- [Long content](https://hextaui.com/docs/separator/examples/long-content.md)
- [Right to left](https://hextaui.com/docs/separator/examples/rtl.md)
