@noaignitereact-utilsuseVisualViewport

useVisualViewport

Tracks window.visualViewport which updates on viewport resize.

  • @param options - Configurable options
  • @returns An object containing size information

Example

const { width, height, scale } = useVisualViewport()
 
if (!width) return null
 
return (
  <div>
    <span>{width} x {height}</span>
    <span>{scale > 1 ? 'Zoomed in' : scale < 1 ? 'Zoomed out' : 'No zoom'}</span>
  </div>
)

See