Separator
A thin divider for splitting content horizontally or vertically.
lily
A calm Svelte component library.
Docs Components GitHub
Installation
Installs the style saved in lily.json. For a new Diamond project,
run lily-svelte init --style diamond first.
Install the lily base and `utils` (run once per project).
npx lily-svelte@latest init Copy the separator source from the registry into $lib/components/ui/separator.
Usage
<script lang="ts">
import { Separator } from '$lib/components/ui/separator';
</script>
<Separator /> Vertical
Set orientation="vertical" inside a flex row. The separator stretches to the row height, so give the row a height.
<div class="flex h-5 items-center gap-4">
<span>Docs</span>
<Separator orientation="vertical" />
<span>Components</span>
</div>