/ src / components / hooks / useResponsiveFontSize.tsx
useResponsiveFontSize.tsx
 1  import { useEffect, useState } from "react";
 2  
 3  export const useResponsiveFontSize = (min = 10, max = 16) => {
 4    const [fontSize, setFontSize] = useState(12);
 5  
 6    useEffect(() => {
 7  
 8      const handleResize = () => {
 9        const width = window.innerWidth;
10        const size = Math.max(min, Math.min(max, width / 100));
11  
12        setFontSize(size);
13      };
14  
15      handleResize(); // initial
16      window.addEventListener("resize", handleResize);
17      
18      return () => window.removeEventListener("resize", handleResize);
19    }, [min, max]);
20  
21    return fontSize;
22  };