Breakpoints

Set-up reusable responsive breakpoints.

To configure the default breakpoints used in responsive array values, add a breakpoints array to your theme.

Each breakpoint should be a string with a CSS length unit included.

theme.js
module.exports = {
  breakpoints: ["640px", "768px", "1024px", "1280px"],
}

These values will be used to generate mobile-first (i.e. min-width) media queries, which can then be used to apply responsive styles.