Về công cụ này
CSS Grid Generator là công cụ miễn phí, chạy trong trình duyệt, biến ba điều khiển đơn giản — số cột, số hàng và khoảng cách (gap) — thành một bố cục CSS grid sẵn sàng để dán. Hãy đặt các giá trị, xem bản xem trước vẽ lại trực tiếp, và sao chép quy tắc được tạo.
Cột và hàng là các số nguyên từ 1 đến 12 (mặc định là 3 và 2), và gap là một thanh trượt từ 0 đến 40 pixel (mặc định 10). Cả hai chiều được viết bằng repeat() và đơn vị 1fr, nên mọi track chia đều không gian sẵn có. Bản xem trước lấp mỗi ô bằng một khối được đánh số, có màu để bạn thấy cấu trúc track thoáng qua, và đầu ra là một quy tắc .grid thuần dùng display: grid, grid-template-columns, grid-template-rows, và gap. Một cú nhấn sao chép nó vào bộ nhớ tạm của bạn.
Mọi thứ chạy hoàn toàn trong trình duyệt của bạn — không tải lên, không tài khoản, không theo dõi — và nó vẫn hoạt động offline sau khi trang đã tải.