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).