CSS弁当グリッドジェネレーター

トレンドの「Bento UI」レイアウトを直感的な操作でマッハ生成。
複雑な display: grid のコードを、視覚的に調整してコピペできます。

スタイルプリセット & 履歴
履歴
グリッド全体の設定
4
3
16px
選択中のアイテム設定
Item 1

右のプレビューでアイテムをクリックするとサイズや色を変更できます。
ドラッグで入れ替え、右下ハンドルでリサイズが可能です。

1
1
0px

選択中のアイテムにダミー要素を流し込みます。

※ PC表示の状態の画像が保存されます。