DE-PACK Component Library

Font Family: Default 

<div class="font-sans">
    <h1>Montserrat</h1>
    <p>Montserrat. The quick brown fox jumps over the lazy dog.
    </p>
</div>

<div class="font-serif">
    <h1>Crimson Text</h1>
    <p>Crimson Text. The quick brown fox jumps over the lazy dog.
    </p>
</div>

<div class="font-mono">
    <h1>Source Code Pro</h1>
    <p>Source Code Pro. The quick brown fox jumps over the lazy dog.
    </p>
</div>
 
<div class="font-sans">
<h1>{{ font_sans }}</h1>
<p>{{ font_sans }}. {{ smalltext }}
</p>
</div>

<div class="font-serif">
<h1>{{ font_serif }}</h1>
<p>{{ font_serif }}. {{ smalltext }}
</p>
</div>

<div class="font-mono">
<h1>{{ font_mono }}</h1>
<p>{{ font_mono }}. {{ smalltext }}
</p></div>
 
{
  "font_sans": "Montserrat",
  "font_serif": "Crimson Text",
  "font_mono": "Source Code Pro",
  "smalltext": "The quick brown fox jumps over the lazy dog."
}