@ulu/frontend/lib/scss/components/_rule.demo.html

A framework-agnostic frontend toolkit providing a modular, tree-shakable library of accessible components and utilities. Designed for seamless integration, it features a highly configurable SCSS system for any environment and vanilla JavaScript modules op

<!-- @ulu-demo
  title: Basic Horizontal Rule
  description: A standard horizontal line used to separate sections of content.
-->
<p>Content above the rule.</p>
<hr class="rule">
<p>Content below the rule.</p>

<!-- @ulu-demo
  title: Short Accent Rule
  description: Using the `rule--short` modifier to create a small, decorative line often used under headings.
-->
<h3 class="h3">Section Title</h3>
<div class="rule rule--short"></div>
<p>A brief introduction to the section follows the decorative short rule.</p>

<!-- @ulu-demo
  title: Large Margin Rule
  description: A rule with increased vertical spacing using the `rule--margin-large` modifier.
-->
<div class="rule rule--margin-large"></div>
<p>This rule creates significant visual separation between major content blocks.</p>