| Breakpoint | Min width | Max width | Container |
|---|---|---|---|
| sm | 640px | 767px | 640px |
| md | 768px | 1023px | 768px |
| lg | 1024px | 1279px | 1024px |
| xl | 1280px | 1535px | 1280px |
| 2xl | 1536px | - | 1536px |
/* sm: min-width 640px */
@media (min-width: 640px) { ... }
/* md: min-width 768px */
@media (min-width: 768px) { ... }
/* lg: min-width 1024px */
@media (min-width: 1024px) { ... }
/* xl: min-width 1280px */
@media (min-width: 1280px) { ... }
/* 2xl: min-width 1536px */
@media (min-width: 1536px) { ... }Yes. No sign-up.
Convert Tailwind utility classes to equivalent CSS. Debug and understand Tailwind output.
Build responsive values with clamp(min, preferred, max). Export CSS and Tailwind. Perfect for fluid typography and spacing.
Visual layout builder for Flexbox and CSS Grid. Export CSS or Tailwind.