<< Go back

Footer


Empty
<footer class="bg-black py-6">
  <div class="container mx-auto px-6 fhd:px-16"></div>
</footer>

With basic content

Footer content

<footer class="bg-black py-6">
  <div class="container mx-auto px-6 fhd:px-16">
      <div class="flex space-x-2 text-sm">
          <p>Footer content</p>
      </div>
  </div>
</footer>

With complex content
<footer class="bg-black py-6 mt-10">
  <div class="container mx-auto px-6 fhd:px-16">
      <div class="grid grid-cols-3 gap-6">
          <div class="flex flex-col gap-1">
              <a href="#" class="underline">Link 1</a>
              <a href="#" class="underline">Link 2</a>
              <a href="#" class="underline">Link 3</a>
          </div>
          <div class="flex flex-col gap-1">
              <a href="#" class="underline">Link 1</a>
              <a href="#" class="underline">Link 2</a>
              <a href="#" class="underline">Link 3</a>
              <a href="#" class="underline">Link 4</a>
              <a href="#" class="underline">Link 5</a>
              <a href="#" class="underline">Link 6</a>
          </div>
            <div class="flex flex-col gap-1">
              <a href="#" class="underline">Privacy</a>
              <a href="#" class="underline">Terms</a>
              <a href="#" class="underline">Contact</a>
          </div>
      </div>
  </div>
</footer>