// module

CSS Systems & Layout

Frontend · Cohort · 3 weeks

AUD 640 (informational)

Visual for CSS Systems & Layout

Responsible mentor

Avatar for Mira Okonkwo

Mira Okonkwo

Frontend mentor; CSS is engineering, not decoration.

Outcomes

  • Ship a two-breakpoint layout with named grid regions
  • Write a short “when to break the system” guide
  • Capture a before/after Lighthouse layout shift note

Description

You build a small design token file, implement responsive grids, and document exceptions when marketing needs a one-off.

Inside the track

  • Custom properties for theming
  • Grid areas with readable naming
  • Container query module
  • Print stylesheet micro-lab
  • Contrast checking workflow
  • Performance-minded animation notes

Reviews

Container query week in CSS Systems & Layout finally made sense of the marketing breakpoints mess.

— Jules (survey)

FAQ

We focus on plain CSS and tokens; utility-first is mentioned comparatively only.