https://github.com/mahdi-hazrati/shiftgrid

ShiftGrid is a modern and intuitive CSS grid system designed to make building responsive layouts a breeze. With ShiftGrid, you can easily create complex designs with just a few lines of code, without sacrificing speed or performance.
https://github.com/mahdi-hazrati/shiftgrid

bootstrap grid-layout grid-system responsive-design responsive-web-design shiftgrid

Last synced: 2 months ago
JSON representation

ShiftGrid is a modern and intuitive CSS grid system designed to make building responsive layouts a breeze. With ShiftGrid, you can easily create complex designs with just a few lines of code, without sacrificing speed or performance.

• Host: GitHub
• URL: https://github.com/mahdi-hazrati/shiftgrid
• Owner: Mahdi-Hazrati
• License: mit
• Created: 2023-06-11T07:11:29.000Z (about 3 years ago)
• Default Branch: master
• Last Pushed: 2023-08-25T15:55:40.000Z (almost 3 years ago)
• Last Synced: 2025-10-29T23:45:23.672Z (8 months ago)
• Topics: bootstrap, grid-layout, grid-system, responsive-design, responsive-web-design, shiftgrid
• Language: CSS
• Homepage: https://mahdi-hazrati.github.io/ShiftGrid/
• Size: 24.4 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# [ShiftGrid](https://www.npmjs.com/package/shiftgrid "ShiftGrid").css [![npm version](https://badge.fury.io/js/shiftgrid.svg)](https://badge.fury.io/js/shiftgrid)

ShiftGrid is a minimalist, flexible grid system for building responsive layouts. It is based on Bootstrap v5's grid and provides an intuitive class naming convention for rapid development.

## Why Use ShiftGrid?

- **Lightweight** - Weighing in at just 86.2 kB minified and gzipped, ShiftGrid adds minimal bloat to your project.

- **Flexible** - The flexible grid structure allows you to customize your layout for any device size. Build everything from mobile to large desktop sites.

- **Intuitive Classes** - Classes like .col-sm-6 make it easy to remember how to quickly build responsive columns and rows.

- **Familiar Syntax** - ShiftGrid uses the same class naming convention as Bootstrap, making it easy to integrate into projects using Bootstrap.

- **Styled by Default** - Some basic styling is included out of the box for columns, gutters, and more.

- **Framework Agnostic** - Use ShiftGrid with React, Vue, Angular, or vanilla HTML/CSS. It's framework agnostic.

## Documentation

For full documentation, installation instructions, examples, and more,

see https://mahdi-hazrati.github.io/ShiftGrid/

## Credits

ShiftGrid was created by [Mahdi Hazrati](https://mahdi-hazrati.github.io/ "Mahdi Hazrati"). It is based on [Bootstrap](https://getbootstrap.com/ "Bootstrap")'s grid system.