Breakpoint tokens
Our breakpoint tokens define the screen sizes we use to build responsive layouts. Use them instead of hardcoded values so responsive behavior stays consistent across products.
Our breakpoint tokens define the screen sizes we use to build responsive layouts. Use them instead of hardcoded values so responsive behavior stays consistent across products.
| Title | Value |
|---|---|
| breakpoint.extraSmall | 320px |
| breakpoint.small | 512px |
| breakpoint.medium | 600px |
| breakpoint.large | 800px |
| breakpoint.extraLarge | 1100px |
| breakpoint.extraLarge2 | 1400px |
| breakpoint.extraLarge3 | 1920px |
| breakpoint.android.compact | breakpoint.extraSmall |
| breakpoint.android.medium | breakpoint.medium |
| breakpoint.android.expanded | breakpoint.large |
| breakpoint.ios.compact | breakpoint.extraSmall |
| breakpoint.ios.regular | breakpoint.medium |
| breakpoint.ios.expanded | breakpoint.large |
