ISSHUN TOOL · GRID-GENERATOR

Grid生成

列数、行数、間隔を指定したCSS Gridの基本形を生成します。

列数行数間隔（px）

生成CSS

.container {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(2, auto);
  gap: 16px;
}

カード一覧などに使えるCSS Gridの基本形を生成します。