<div style="padding: var(--size-4);">
<h1 class="mexican-pink">
Horizontal Rule
<span class="token string" style="font-size: var(--font-size-2)">selective-yellow</span>
</h1>
<h3 class="celestial-blue">Default Size</h3>
<hr class="selective-yellow">
<h3 class="celestial-blue">Size <span class="token string" style="font-size: var(--font-size-2)">size-1</span></h3>
<hr class="selective-yellow size-1">
<h3 class="celestial-blue">Size <span class="token string" style="font-size: var(--font-size-2)">size-2</span></h3>
<hr class="selective-yellow size-2">
<h3 class="celestial-blue">Size <span class="token string" style="font-size: var(--font-size-2)">size-3</span></h3>
<hr class="selective-yellow size-3">
<h3 class="celestial-blue">Size <span class="token string" style="font-size: var(--font-size-2)">size-4</span></h3>
<hr class="selective-yellow size-4">
</div>
<div style="padding: var(--size-4);">
<h1 class="mexican-pink">
Horizontal Rule
{{#if modifier}}<span class="token string" style="font-size: var(--font-size-2)">{{modifier}}</span>{{/if}}
</h1>
<h3 class="celestial-blue">Default Size</h3>
<hr {{#if modifier}}class="{{modifier}}"{{/if}}>
<h3 class="celestial-blue">Size <span class="token string" style="font-size: var(--font-size-2)">size-1</span></h3>
<hr class="{{#if modifier}}{{modifier}}{{/if}} size-1">
<h3 class="celestial-blue">Size <span class="token string" style="font-size: var(--font-size-2)">size-2</span></h3>
<hr class="{{#if modifier}}{{modifier}}{{/if}} size-2">
<h3 class="celestial-blue">Size <span class="token string" style="font-size: var(--font-size-2)">size-3</span></h3>
<hr class="{{#if modifier}}{{modifier}}{{/if}} size-3">
<h3 class="celestial-blue">Size <span class="token string" style="font-size: var(--font-size-2)">size-4</span></h3>
<hr class="{{#if modifier}}{{modifier}}{{/if}} size-4">
</div>
{
"modifier": "selective-yellow"
}
No notes defined.