Divider

A Divider component separates content within a layout. Built on top of heroui-native Separator.

Demo

Demo Coming Soon

Divider examples will be available soon.

Usage

import { NDivider } from '@nayan-ui/react';
const Divider = () => {
return (
<div>
<h1 className="text-foreground mb-3 text-lg">Horizontal:</h1>
<NDivider orientation="horizontal" className="my-3" />
<h1 className="text-foreground mb-3 text-lg">Horizontal with Text:</h1>
<NDivider orientation="horizontal" className="h-5">OR</NDivider>
<h1 className="text-foreground mb-3 text-lg">Vertical:</h1>
<NDivider orientation="vertical" className="h-5" />
</div>
);
};
export default Divider;

Attributes

NameTypeDefaultDetails
classNamestring' 'You can customise by passing tailwind classes.
orientationvertical | horizontalhorizontalYou can pass divider orientation.