Tailwind CSS Classes

Tailwind CSS class .gap-0 / .gap-*

<div class="grid grid-cols-3 gap-4">
  <div class="h-4 bg-teal-400"></div>
  <div class="h-4 bg-teal-400"></div>
  <div class="h-4 bg-teal-400"></div>
  <div class="h-4 bg-teal-400"></div>
  <div class="h-4 bg-teal-400"></div>
  <div class="h-4 bg-teal-400"></div>
</div>

Preview

Are you tired of writing HTML by hand?

CSS source

.gap-0 { gap: 0; }
.gap-1 { gap: 0.25rem; }
.gap-2 { gap: 0.5rem; }
.gap-3 { gap: 0.75rem; }
.gap-4 { gap: 1rem; }
.gap-5 { gap: 1.25rem; }
.gap-6 { gap: 1.5rem; }
.gap-8 { gap: 2rem; }
.gap-10 { gap: 2.5rem; }
.gap-12 { gap: 3rem; }
.gap-16 { gap: 4rem; }
.gap-20 { gap: 5rem; }
.gap-24 { gap: 6rem; }
.gap-32 { gap: 8rem; }
.gap-40 { gap: 10rem; }
.gap-48 { gap: 12rem; }
.gap-56 { gap: 14rem; }
.gap-64 { gap: 16rem; }
.gap-px { gap: 1px; }

More Tailwind CSS classes in Grid category

© 2024 Shuffle. All rights reserved.