Column scaffolds that structure a page. Start with one, then fill the columns with your content. Each one is a real, accessible composition of AWT blocks. Open any pattern to try it live in both color schemes and see the blocks it is built from.
Layout: one column (narrow)
A single narrow column, about a 42rem reading width.
Open the Layout: one column (narrow) pattern
Layout: one column (contained)
A single column at the default content width.
Open the Layout: one column (contained) pattern
Layout: one column (full width)
A single column at full width, with no maximum.
Open the Layout: one column (full width) pattern
Layout: two columns (25/75)
Two columns, a narrow quarter beside a wide three-quarters.
Open the Layout: two columns (25/75) pattern
Layout: two columns (75/25)
Two columns, a wide three-quarters beside a narrow quarter.
Open the Layout: two columns (75/25) pattern
Layout: two columns (33/66)
Two columns, a third beside two-thirds.
Open the Layout: two columns (33/66) pattern
Layout: two columns (66/33)
Two columns, two-thirds beside a third.
Open the Layout: two columns (66/33) pattern
Layout: three columns (25/50/25)
Three columns with a wider middle: sidebar, main content, sidebar.
Open the Layout: three columns (25/50/25) pattern
Layout: stacked sections
Three stacked sections with consistent spacing.
Open the Layout: stacked sections pattern