Divider

A squiggly rule. Horizontal fills the width. Vertical fills the height.

Roughness1.5Lock seedOrientation

<Divider orientation="horizontal" roughness={1.5} />

Usage

import { Divider } from "doodleui-react";

<Divider />
<Divider orientation="vertical" style={{ height: 120 }} />

Bowing defaults a little higher than other components so the line reads as a drawn stroke, not a hairline.

Prop	Type	Default	Notes
orientation	"horizontal" \| "vertical"	"horizontal"	Axis of the squiggle.
roughness	number	1.5	How wobbly the stroke is. 0 is almost geometric. 3+ is messy.
seed	number	provider / random	Locks the sketch. Omit to follow SketchSeedProvider (Shuffle) or a mount-time random seed.
sketchColor	string	#1f1d1a	Stroke color. Also tints primary/accent fills where relevant.
className	string	undefined	Passed through to the root element.
style	CSSProperties	undefined	Passed through to the root element.