Rehooks
Content

useWindowSize

Custom hook that tracks and returns the current window size.

useWindowSize

Usage

Component.tsx
import { useWindowSize } from "~/hooks/useWindowSize";
 
function Component() {
  const { width, height } = useWindowSize();
 
  return (
    <div>
      <h1>Window Size</h1>
      <p>Width: {width}px</p>
      <p>Height: {height}px</p>
    </div>
  );
}

API

useWindowSize

function useWindowSize(): WindowSize;

Custom hook that tracks and returns the current window size.

Returns

NameTypeDescription
widthWindowSizeThe current width of the window.
heightWindowSizeThe current height of the window.

On this page