Screen Sizes
Bootstrap 5 Screen Sizes component
Responsive Screen Sizes built with Bootstrap 5. Check default pixel widths for different screen sizes supported by Bootstrap 5 responsiveness features.
Bootstrap supports six default viewport widths. These presets can be changes or expanded upon, if you’re using our source Sass files.
| Breakpoint | Class infix | Dimensions |
|---|---|---|
| X-Small | None | 0–576px |
| Small | sm |
≥576px |
| Medium | md |
≥768px |
| Large | lg |
≥992px |
| Extra large | xl |
≥1200px |
| Extra extra large | xxl |
≥1400px |
Each width is a multiple of 12. They are adjusted to the most common device viewport sizes.
Make sure to check out the main Breakpoints documentation for more customization options & media queries.
$grid-breakpoints: ( xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px, xxl: 1400px );