Tailwind CSS Grid Layout Examples

1. Basic 3-Column Grid

1

2

3

2. Responsive Grid

Item 1

Item 2

Item 3

Item 4

3. Column Spanning

Span 2

Span 1

Span 1

4. Auto-Fit Grid (Responsive Cards)

Card 1

Card 2

Card 3

Card 4

5. Centering Items (place-items)

Centered Box

6. Different Gaps

1

2

3

4

5

6