useScreenSize

Returns the current inner dimensions of the browser window.

Caution

Frequent resizing can trigger many re-renders. If you only need to react to specific breakpoints, consider using useIsDesktop or a matchMedia based hook instead for better performance.

Installation

bash

Description

A reactive hook that tracks the window.innerWidth and window.innerHeight. It attaches a single resize listener on mount and cleans it up on unmount, providing a real-time object of the viewport dimensions.

Return values

NameTypeDescription
heightnumberThe current window.innerHeight.
widthnumberThe current window.innerWidth.

Demo

Screen Size

0 x 0

Resize your browser to see changes

Source code

tsx