Blocks

Divider Block

> Visual separator between content sections.


Overview

The Divider block creates visual breaks between sections. Use it to add rhythm to long pages and separate distinct content areas.


Fields

FieldDescription
StyleSpace Only, Horizontal Line, Line with Text, or Line with Icon
Spacing HeightSmall, Medium, Large, or Extra Large vertical padding
Content WidthContainer width for the divider

Line Options

These options appear when using line styles (not "Space Only"):

FieldDescription
ColorDaisyUI semantic colors: Default, Primary, Secondary, Accent, Neutral, Success, Warning, Info, Error
Content PositionCenter, Start, or End (for text/icon variants)
Divider TextCustom text to display (Line with Text style)
IconHeroicon to display (Line with Icon style)

Styles

  • Space Only: Invisible vertical spacing between sections
  • Horizontal Line: Simple line with optional color
  • Line with Text: Line interrupted by centered text (e.g., "OR", "Section 2")
  • Line with Icon: Line interrupted by a centered icon

Examples

OR
OR
OR

Comments

No comments yet. Be the first to share your thoughts!

Choose Theme