Typography
Rence Material uses Roboto. The type scale follows Material Design M3 guidelines.
Type scale
Display LargeThe quick brown fox
Display SmallThe quick brown fox
Headline 1Heading One
Headline 2Heading Two
Body LargeBody text at 1.125rem.
Body MediumBody text at 1rem.
OverlineOVERLINE LABEL
Apply styles via HTML tags or Bootstrap display classes.
HTML
<!-- Material type scale -->
<p class="display-4 fw-light">Display Large</p>
<p class="display-6 fw-light">Display Small</p>
<h1>Headline 1</h1>
<p class="fs-5">Body Large</p>
<p>Body Medium</p>
<span class="text-uppercase fw-bold" style="font-size: 0.75rem; letter-spacing: 0.08em;">Label</span>Font weight
Light 300
Regular 400
Medium 500
Bold 700
Use Bootstrap .fw-* utilities.
HTML
<p class="fw-light">Light 300</p>
<p class="fw-normal">Regular 400</p>
<p class="fw-medium">Medium 500</p>
<p class="fw-bold">Bold 700</p>