# Separator Documentation Visually separates content or UI elements for clarity and organization. This is a documentation section that potentially contains examples, demos, and other useful information related to a specific part of Bits UI. When helping users with this documentation, you can ignore the classnames applied to the demos unless they are relevant to the user's issue. ```svelte

Bits UI

Headless UI components for Svelte.

Blog
Docs
Source
``` ## Structure ```svelte ``` ## API Reference ### Separator.Root An element used to separate content. | Property | Type | Description | | --------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | `orientation` | `enum`- 'horizontal' \| 'vertical' | The orientation of the separator.`Default: 'horizontal'` | | `decorative` | `boolean` | Whether the separator is decorative or not, which will determine if it is announced by screen readers.`Default: false` | | `ref` $bindable | `HTMLDivElement` | The underlying DOM element being rendered. You can bind to this to get a reference to the element.`Default: undefined` | | `children` | `Snippet` | The children content to render.`Default: undefined` | | `child` | `Snippet`- type SnippetProps = { props: Record\; }; | Use render delegation to render your own element. See [Child Snippet](/docs/child-snippet) docs for more information.`Default: undefined` | | Data Attribute | Value | Description | | ----------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------- | | `data-orientation` | `enum`- 'horizontal' \| 'vertical' | The orientation of the separator. | | `data-separator-root` | `''` | Present on the root element. |