Gx

Grid System

Minimal responsive React grid system based on the Fab Four Technique.

npm i gx
Element-query-like behavior
No CSS dependencies
No client-side JS
Works with server-side rendering
Single React Component
<1KB gzipped & minified

Examples

Default Gx
Default Gx
Col 4 Gx
Col 4 Gx
Col 4 Gx
Col 3 Gx
Col 3 Gx
Col 3 Gx
Col 3 Gx
Col 2 Gx
Col 2 Gx
Col 2 Gx
Col 2 Gx
Col 2 Gx
Col 2 Gx
Breakpoint 768 Gx
Breakpoint 768 Gx
Breakpoint 768 Gx
Breakpoint 512 Gx

Col 4

Col 8

Nested Gx
Nested Gx

480px Container

Col 6
Col 6

640px Container

Col 6
Col 6

Get Started

Learn more and read the documentation on GitHub

GitHub