Kevin Schaul

Visual journalist/hacker

Stitches inline media queries

April 25, 2024

Finally figured out how to write inline media queries in Stitches:

const Button = styled('button', {
  background: 'blue',
  '@media (max-width: 462px)': {
    background: 'orange',
  },
})

You can just write the media query directly in here. No needing to fuss with creating global breakpoints when you just need something small to happen at a specific width. Wow.

h/t claude.ai, which I’ve been using a ton of lately.