A hook that checks whether the viewport matches a given breakpoint.
sm (40rem): No
md (48rem): No
lg (64rem): No
xl (80rem): No
2xl (96rem): No
breakpoint'sm'|'md'|'lg'|'xl'|'2xl'| Prop | Type | Default |
|---|---|---|
breakpoint | 'sm'|'md'|'lg'|'xl'|'2xl' | - |
matchesboolean| Prop | Type | Default |
|---|---|---|
matches | boolean | - |
import { useBreakpoint } from '@k8ordo/ui';const isMd = useBreakpoint('md');
const isLg = useBreakpoint('lg');
return (
<div>
<p>md (48rem): {isMd ? 'Yes' : 'No'}</p>
<p>lg (64rem): {isLg ? 'Yes' : 'No'}</p>
</div>
);