Svelte 5 Section Divider – Visual Separator

Clean horizontal or vertical divider with optional label. Useful for sectioning dashboard content.

web design systemdieter rams web designindustrial UI design

Preview

Use Case

Simple but essential, the Divider creates visual breathing room between sections. Optional label support makes it useful for creating named sections.

Props API

Divider component props
PropTypeDefaultDescription
orientation 'horizontal' | 'vertical''horizontal'Divider orientation
label string—Optional center label
class string—Additional CSS classes

Related Components

PanelToolbar

See it in Action

Explore the Divider in an interactive dashboard environment.

Customize in Showroom

More Layout Components

Panel

The Panel component groups related content with a consistent label style.

Toolbar

This control strip combines multiple input types into a cohesive unit, reducing visual noise while maximizing functionality.

Pagination

Designed to scale from 5 to 500 pages, this pagination component uses smart ellipsis logic to keep the UI compact while maintaining context.