Header Section

Displays page titles, descriptions, and introductory content at the top of sections.

Basic Header Section

Our features

Everything you need to build modern applications with speed and confidence.

<div class="py-12 px-6">
  <div class="max-w-lg">
    <h2 class="ff-s fs-3xl fw-600 tc-slate-10 mb-2">Our features</h2>
    <p class="fs-md tc-silver-10 m-0">Everything you need to build modern applications with speed and confidence.</p>
  </div>
</div>

Centered

How it works

Get started in three simple steps and start seeing results immediately.

<div class="py-12 px-6 ta-c">
  <div class="max-w-lg m-auto">
    <h2 class="ff-s fs-3xl fw-600 tc-slate-10 mb-2">How it works</h2>
    <p class="fs-md tc-silver-10 m-0">Get started in three simple steps and start seeing results immediately.</p>
  </div>
</div>

Label

Features

Powerful tools for modern teams

Discover the capabilities that help you work smarter and faster.

<div class="py-12 px-6 ta-c">
  <div class="max-w-lg m-auto">
    <span class="fs-xs fw-600 tc-indigo tt-u ls-4 mb-3 d-ib">Features</span>
    <h2 class="ff-s fs-3xl fw-600 tc-slate-10 mb-2">Powerful tools for modern teams</h2>
    <p class="fs-md tc-silver-10 m-0">Discover the capabilities that help you work smarter and faster.</p>
  </div>
</div>