Preview:
$columns: 1 !default;
2
​

$breakpoints: (

  xs: 0,

  sm: 40px,
6
  md: 24px,

  lg: 0px
8
);

​
10
.demo{

  display: grid;
12
  place-content: center;

  background: #111;

  color: white;

  padding: 1rem;

}

​

@mixin breakpoint($size) {

  @media (min-width: map-get($breakpoints, $size)) {

    @content;

  }

}
downloadDownload PNG downloadDownload JPEG downloadDownload SVG

Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!

Click to optimize width for Twitter