Primitive
Separator CSS-only
Visual divider between sections. Plain horizontal rule, optional center label, vertical orientation for inline groups.
About
Overview
Use a separator when whitespace alone isn't enough to break up content — for example between unrelated form sections, or to mark "or" between two distinct paths.
Live
Demo
Above
Below
Or continue with
<hr class="ren-divider">
<div class="ren-divider">Or continue with</div>Reference
API
| Class | Effect |
|---|---|
.ren-divider | On <hr> for a plain horizontal divider, or on a <div> with text for a labelled divider. |
.ren-divider-vertical | Vertical 1 px line. Use inside flex rows to separate inline items. |
Inclusive by default
Accessibility
Use the semantic <hr> tag. Screen readers announce it as "separator". For a div-based labelled divider, add role="separator".