DAHLIA Pattern Library

Headings 

<h3 class="t-alpha t-sans">The Frozen Dreams (alpha sans)</h3>

<p class="c-steel margin-bottom--2x">Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare vel eu leo.</p>

<h3 class="t-alpha t-serif">The Frozen Dreams (alpha serif)</h3>

<p class="c-steel margin-bottom--2x">Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare vel eu leo.</p>

<h3 class="h-caps t-alpha t-sans">The Frozen Dreams (alpha sans caps)</h3>

<p class="c-steel margin-bottom--2x">Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare vel eu leo.</p>
<h3 class="t-beta t-sans">The Frozen Dreams (beta sans)</h3>

<p class="c-steel margin-bottom--2x">Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare vel eu leo.</p>

<h3 class="t-beta t-serif">The Frozen Dreams (beta serif)</h3>

<p class="c-steel margin-bottom--2x">Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare vel eu leo.</p>

<h3 class="h-caps t-beta t-sans">The Frozen Dreams (beta sans caps)</h3>

<p class="c-steel margin-bottom--2x">Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare vel eu leo.</p>
<h3 class="t-gamma t-sans">The Frozen Dreams (gamma sans)</h3>

<p class="c-steel margin-bottom--2x">Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare vel eu leo.</p>

<h3 class="t-gamma t-serif">The Frozen Dreams (gamma serif)</h3>

<p class="c-steel margin-bottom--2x">Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare vel eu leo.</p>

<h3 class="h-caps t-gamma t-sans">The Frozen Dreams (gamma sans caps)</h3>

<p class="c-steel margin-bottom--2x">Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare vel eu leo.</p>
<h3 class="t-delta t-sans">The Frozen Dreams (delta sans)</h3>

<p class="c-steel margin-bottom--2x">Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare vel eu leo.</p>

<h3 class="t-delta t-serif">The Frozen Dreams (delta serif)</h3>

<p class="c-steel margin-bottom--2x">Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare vel eu leo.</p>

<h3 class="h-caps t-delta t-sans">The Frozen Dreams (delta sans caps)</h3>

<p class="c-steel margin-bottom--2x">Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare vel eu leo.</p>
<h3 class="t-epsilon t-sans">The Frozen Dreams (epsilon sans)</h3>

<p class="c-steel margin-bottom--2x">Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare vel eu leo.</p>

<h3 class="t-epsilon t-serif">The Frozen Dreams (epsilon serif)</h3>

<p class="c-steel margin-bottom--2x">Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare vel eu leo.</p>

<h3 class="h-caps t-epsilon t-sans">The Frozen Dreams (epsilon sans caps)</h3>

<p class="c-steel margin-bottom--2x">Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare vel eu leo.</p>
<h3 class="t-base t-sans">The Frozen Dreams (base sans)</h3>

<p class="c-steel margin-bottom--2x">Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare vel eu leo.</p>

<h3 class="t-base t-serif">The Frozen Dreams (base serif)</h3>

<p class="c-steel margin-bottom--2x">Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare vel eu leo.</p>

<h3 class="h-caps t-base t-sans">The Frozen Dreams (base sans caps)</h3>

<p class="c-steel margin-bottom--2x">Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare vel eu leo.</p>
 
{{#each type.header.size}}
  <h3 class="t-{{this}} t-sans">The Frozen Dreams ({{this}} sans)</h3>

  <p class="c-steel margin-bottom--2x">Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare vel eu leo.</p>

  <h3 class="t-{{this}} t-serif">The Frozen Dreams ({{this}} serif)</h3>

  <p class="c-steel margin-bottom--2x">Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare vel eu leo.</p>

  <h3 class="h-caps t-{{this}} t-sans">The Frozen Dreams ({{this}} sans caps)</h3>

  <p class="c-steel margin-bottom--2x">Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare vel eu leo.</p>
{{/each}}
 
{
  "type": {
    "header": {
      "size": [
        "alpha",
        "beta",
        "gamma",
        "delta",
        "epsilon",
        "base"
      ]
    },
    "paragraph": {
      "size": [
        "gamma",
        "delta",
        "epsilon",
        "base",
        "small",
        "tiny"
      ]
    }
  }
}

There are no notes for this item.