hero-image

Spacers & Dividers

configurable spacers and dividers when you need to add more breathing room.

Divider component

The Divider component allows adding hairline dividers between components using desired thickness and color from the currently selected theme. Thickness options are configurable by the developer on the parameter settings.

Example: a 1px divider in primary color

Example: a 10px divider in accent color

Spacer component

The Spacer component allows adding spacing between components using transparent space. Spacing is configurable by the developer on parameter settings. With vertical and horizontal variants, it gives you complete control over content arrangement and layout. Whether you want to create a breathing room or organize elements with precision, this feature lets you fine-tune the spacing to suit your needs.

Example: a 100px horizontal spacer:

Before content

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

After content

Lorem ipsum dolor sit amet, consectetur adipiscing elit.