Считается локально
Генератор Grid
Колонки, ряды и промежуток как CSS Grid.
1
2
3
4
display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(80px, auto)); gap: 12px;
Экспорт и импорт доступны после входа в аккаунт. Войти
Копирует шаблон сетки для таблицы стилей.
Об инструменте
Соберите простую CSS-сетку для карточек, галереи или дашборда. Выберите количество колонок и отступ между ними, проверьте предпросмотр и скопируйте CSS.
Как пользоваться
- 01
Задайте число колонок.
- 02
Задайте отступ.
- 03
Скопируйте CSS сетки.
FAQ
Частые вопросы
Что содержит сгенерированный CSS?
display: grid, grid-template для колонок и строк и выбранный gap.
Как сделать сетку адаптивной?
Меняйте число колонок в медиазапросе или используйте repeat(auto-fit, minmax(…)) в своих стилях.