useMediaQuery

Read responsive state and viewport changes without rewriting browser event plumbing.

Preview

Responsive branching

A media-query helper typically drives whether you render a compact mobile variant or a denser desktop layout.

Registry install

pnpm dlx shadcn@latest add @tile-ui/use-media-query

Usage

const isMobile = useMediaQuery('(max-width: 768px)');