decorative

Ornaments

Decorative dividers, corners, and symbols.

npx chaos add ornaments

PREVIEW

✝

USAGE

import { Ornaments } from '@/components/chaos/decorative/ornaments';

<Ornaments type="divider" symbol="fleurDeLis" />
<Ornaments type="symbols" symbols={['star', 'diamond', 'star']} />
<Ornaments type="corner" position="all" variant="gold" />

PROPS

PropTypeDefault

typeOrnament type

"divider" | "corner" | "frame" | "fleuron" | "symbols""divider"

symbolSymbol to use

keyof typeof ORNAMENT_SYMBOLS | string"cross"

symbolsMultiple symbols (for type="symbols")

(keyof typeof ORNAMENT_SYMBOLS | string)[]-

variantColor variant

"gold" | "bone" | "blood" | "iron""gold"

sizeSize

"sm" | "md" | "lg""md"

animatedAnimate

booleanfalse

positionCorner position (for type="corner")

"top-left" | "top-right" | "bottom-left" | "bottom-right" | "all""all"