font-size の指定に使える幅基準は vw が使えるので

このようにすると画面幅に対してリニアに可変する。

#hoge{
    font-size: 2vw;
}

しかし、これでは画面サイズによってはデカすぎ、小さすぎ問題がおこるので、制限をかける。

#hoge{
    font-size: clamp(1rem, 2vw, 5rem);
}

このように記述すると、下限は 1rem 上限は 5rem の範囲で途中はリニアに変化するようになる。

html{
    font-size: 62.5%;
}

Webでの標準フォントサイズは 16px なので、こいつを 10px 基準にするための数値が 62.5％。

こうすると、1rem が 10px として扱えるので拡大縮小に耐えつつも単位が直感的にわかりやすくなるというメリットがある。

しかし個人的にはフォントサイズなんて1画面に4つもあればいいと思っているのでそれを変数にブチ込んで使っている。