Responsive Breakpoint Generator
Generate CSS media queries for common device breakpoints.
Generate CSS media queries for common device breakpoints.
sm
640px
md
768px
lg
1024px
xl
1280px
2xl
1536px
/* Small devices (landscape phones, 640px and up) */
@media (min-width: 640px) { ... }
/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) { ... }
/* Large devices (desktops, 1024px and up) */
@media (min-width: 1024px) { ... }
/* Extra large devices (large desktops, 1280px and up) */
@media (min-width: 1280px) { ... }
/* 2X large devices (larger desktops, 1536px and up) */
@media (min-width: 1536px) { ... }