import { Grid } from "tailwind-react-grid-overlay";

<Grid
  // optional: default is `true`
  visibleByDefault={false}
  //
  // Sets of columns for each breakpoint
  // In this example the mobile columns have outside margin and borders
  // The others will touch to the outer edges of the window
  cols={[
    {
      breakpoint: `default`,
      columns: 6,
      className: `mx-4 border-l border-r border-red-500`,
    },
    { breakpoint: `md`, columns: 12, className: `` },
    { breakpoint: `xl`, columns: 16, className: `` },
  ]}
/>;