Skip to Main Content

Horizontal Rules

Using Horizontal Rules

Horizontal rules are a great way to add clear visual distinction between sections of information. Clone allows for minimal thickness and color variation to ensure rules can be customized to meet your theme.

Markup

<hr data-c-hr="WIDTH(COLOR)">

Available Arguments

# WIDTH

thin
thick
# COLOUR

white
gray / grey
black
c1 (Theme Colour 01)
c2 (Theme Colour 02)
c3 (Theme Colour 03)
c4 (Theme Colour 04)
c5 (Theme Colour 05)
stop
slow
go

In Practice

<!--Thin black rule.-->
<hr data-c-hr="thin(black)">
<!--Thick theme colour 1 rule.-->
<hr data-c-hr="thick(c1)">

Changelog

Version 2.4.9