Watch
Responsive design 0:46
A 46-second explainer of Responsive design, narrated over the same demo you can try yourself.
Try the interactive Responsive design demo
What this video covers
Responsive design is building one layout that adapts to any screen - fluid widths that stretch and shrink, plus breakpoints where the structure itself rearranges (a three-column grid becoming one column, a menu collapsing). One codebase, one URL, reshaping itself to fit the space rather than shipping a separate "mobile site".
Drag the edge in and the layout didn't just shrink - at certain widths it reorganised: the columns stacked, the row of cards became a list, the navigation folded away. That re-structuring at breakpoints, not mere scaling, is what makes a design responsive. One layout, comfortable at every width you dragged it to.
