The SDAIA grid system provides flexible, responsive layout primitives based on a 12-column grid. The grid adapts across breakpoints to maintain consistent layout structure.
Breakpoints
The grid uses five responsive breakpoints to control layout at different screen sizes.
Name
Size(16px base)
Pixels
sm
640px
Small
md
768px
Medium
lg
1024px
Large
xl
1280px
Extra Large
2xl
1536px
2X Large
Column Spans
Components can span any number of columns from 1 to 12. Common patterns include full-width (12 cols), halves (6 cols), thirds (4 cols), and quarters (3 cols).