A breakpoint ladder is the rhythm of viewport widths where a layout shifts. Tailwind's default ladder is 640/768/1024/1280/1536px. Catalogued sites in AI2 Design rarely diverge — Linear extends container max-width to 1436px at the top tier, Stripe stays at 1080px, and most stay in the standard range. Mobile-first and desktop-first refer to the direction breakpoints are written; ladder is the absolute values regardless of direction.
Glossary · spacing
Breakpoint Ladder
The fixed set of viewport widths (sm, md, lg, xl, 2xl) a design system uses to switch between responsive layouts.
Catalogued examples
2 catalogued sites demonstrate breakpoint ladder in production.