Build this UI: dashboard layout
A full-page app layout with a sidebar, a top bar and a grid of stat cards.
advancedHTML & CSS
The task
Lay out the dashboard to match the demo, using CSS Grid with named areas:
- A sidebar on the left (navy, full height), a top bar, and the main area.
- In main, stat cards in a row of up to 3, then a wide "Recent activity" panel.
- On screens narrower than 700px the sidebar becomes a row of links at the top and the cards stack.
What you'll build
The finished result. Try it out, then build it yourself below.
Demo · drag the bottom edge to make it taller