Dividers

Divider used to separate components

Divider Line 1

Horizontal lines, height 1px. Multi colors

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque eleifend mollis volutpat. Sed at consequat nunc. Ut magna sapien, tempor ac lorem quis, sollicitudin gravida mauris. Phasellus eget pulvinar tellus. Ut vitae ex aliquam, iaculis ligula a, sollicitudin tellus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nullam vehicula et risus ut pretium. In in quam magna.

Divider style 1

Use .divider-x-1 class and .border-[colors] class

Divider Line 2

Horizontal lines, height 2px. Multi colors

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque eleifend mollis volutpat. Sed at consequat nunc. Ut magna sapien, tempor ac lorem quis, sollicitudin gravida mauris. Phasellus eget pulvinar tellus. Ut vitae ex aliquam, iaculis ligula a, sollicitudin tellus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nullam vehicula et risus ut pretium. In in quam magna.

Divider style 2

Use .divider-x-2 class and .border-[colors] class

Divider dots

3 dots. Custom text align. Multi colors

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque eleifend mollis volutpat. Sed at consequat nunc. Ut magna sapien, tempor ac lorem quis, sollicitudin gravida mauris. Phasellus eget pulvinar tellus. Ut vitae ex aliquam, iaculis ligula a, sollicitudin tellus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nullam vehicula et risus ut pretium. In in quam magna.

Divider style 3

Use .divider-dots class

Divider icon

Centered icon and Horizontal lines

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque eleifend mollis volutpat. Sed at consequat nunc. Ut magna sapien, tempor ac lorem quis, sollicitudin gravida mauris. Phasellus eget pulvinar tellus. Ut vitae ex aliquam, iaculis ligula a, sollicitudin tellus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nullam vehicula et risus ut pretium. In in quam magna.

Divider style 4

Use .divider-icon class