Layout
The NSW Design System is built on a 12 column responsive grid which adapts to the user’s viewport to provide the optimal layout.
Breakpoints
|
Breakpoint |
Dimensions |
Columns |
Margins |
Gutters (Split) |
|---|---|---|---|---|
|
xs (Extra Small) |
0-575px |
1 |
16px |
16px (8px) |
|
sm (Small) |
576-767px |
Up to 2 |
16px |
16px (8px) |
|
md (Medium) |
768-991px |
Up to 3 |
32px (16px) |
16px (8px) |
|
lg (Large) |
992-1199px |
Up to 4 |
32px (16px) |
32px (16px) |
|
xl (Extra Large) |
1200px+ |
Up to 4 |
32px (16px) |
32px (16px) |
Grid
Example of applied grid
Last updated