Divider

Divider separates content with a thin horizontal or vertical line, with an optional dashed style.

First section

Content before the divider.

Second section

Content after the divider.

import Divider from '@/components/ui/divider';

export default function UsageDemo() {
  return (

Installation

Add this component with the NateUI CLI.

npx @nateui/cli@latest add Divider

pnpm dlx @nateui/cli@latest add Divider

yarn dlx @nateui/cli@latest add Divider

import Divider from '@/components/ui/divider';

export default function VerticalDemo() {
  return (

import Divider from '@/components/ui/divider';

export default function DashedDemo() {
  return (

Prop	Description	Type	Default
`orientation`	Direction of the separator line.	`'horizontal' \| 'vertical'`	`'horizontal'`
`dashed`	Renders a dashed line instead of solid.	`boolean`	`false`
`className`	Additional classes on the separator element.	`string`	`''`