Skip to content

Instantly share code, notes, and snippets.

@jenlampton

jenlampton/gist:c3a1bf7a8b19953fa6bb9079c0ac2b64

Created May 29, 2025 00:04
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save jenlampton/c3a1bf7a8b19953fa6bb9079c0ac2b64 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save jenlampton/c3a1bf7a8b19953fa6bb9079c0ac2b64 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. jenlampton created this gist May 29, 2025.
    36 changes: 36 additions & 0 deletions gistfile1.txt
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,36 @@
    @media (min-width: 25em) { /* 400px @ 16px font size -- XS */
    :root {
    --screen: 25em;
    --max-area: 20em;
    }
    }
    @media (min-width: 34em) { /* 544px @ 16px font size -- SM */
    :root {
    --screen: 34em;
    --max-area: 30em;
    }
    }
    @media (min-width: 48em) { /* 768px @ 16px font size -- MD */
    :root {
    --screen: 48em;
    --max-area: 42em;
    }
    }
    @media (min-width: 62em) { /* 992px @ 16px font size -- LG */
    :root {
    --screen: 62em;
    --max-area: 60em;
    }
    }
    @media (min-width: 75em) { /* 1200px @ 16px font size -- XL */
    :root {
    --screen: 75em;
    --max-area: 70em;
    }
    }
    @media (min-width: 90em) { /* 1440px @ 16px font size -- XXL */
    :root {
    --screen: 90em;
    --max-area: 80em;
    }
    }