| Small | Medium | Large | Extra large | |
| Width | >=576px |
>=768px |
>=992px |
>=1200px |
| Class Prefix | .sm- |
.md- |
.lg- |
.xl- |
// Extra small devices (portrait phones, less than 576px)
// No media query for `xs` since framework is mobile first
// Small devices (landscape phones, 576px and up)
@media (min-width: 576px) { ... }
// Medium devices (tablets, 768px and up)
@media (min-width: 768px) { ... }
// Large devices (desktops, 992px and up)
@media (min-width: 992px) { ... }
// Extra large devices (large desktops, 1200px and up)
@media (min-width: 1200px) { ... }