Grid Lab

Build responsive column and gap values while watching the layout react.

Digital lab instrument

Input controls

Columns3Gap16px

123456

Generated formulaAdjust an instrument to begin.

.layout {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}