CSS Grid Builder

Configure grid-template-columns, rows, and gap with live CSS output

Columns

Col unit

Rows

Row unit

gap16px

CSS Output

.grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  gap: 16px;
}