**Edição 1** Bem, eu li erroneamente a pergunta e acabei respondendo sobre responsividade de acordo com a ***viewport***. Correndo o risco de ter votos negativos, deixarei minha resposta, **mesmo errada**, porque pode ser útil. ---------------------------------------------------------**********--------------------------------------------------------------- Você pode conseguir responsividade na tipografia usando somente CSS. Primeiro, você pode recorrer à unidade ***[em][1]*** ou à ***%***: <!-- begin snippet: js hide: false console: true babel: false --> <!-- language: lang-css --> body { /** Faz a fonte ficar 2 vezes maior que o normal **/ font-size: 2em; /** Fonte 95% do tamanho do normal font-size: 95%; **/ } <!-- end snippet --> Ou ainda, aliar esses tipos de fonte com ***[media queries][2]*** ou, ainda, usar as media queries com os tamanhos de fonte para cada tamanho de tela: <!-- begin snippet: js hide: false console: true babel: false --> <!-- language: lang-css --> /** Tela com até 600px **/ @media (max-width: 600px){ body{ font-size: 10px; } } /** Tela com até 959px, maior que 600px **/ @media (max-width: 959px){ body{ font-size: 14px; } } /** Tela com 960px + **/ @media (min-width: 960px){ body{ font-size: 14px; } } <!-- end snippet --> **A melhor solução CSS** Use a unidade ***[vw][3]*** <!-- begin snippet: js hide: false console: true babel: false --> <!-- language: lang-css --> body{ font-size: 8vw; } <!-- end snippet --> [1]: https://www.w3.org/Style/Examples/007/units.pt_BR.html [2]: https://developer.mozilla.org/pt-BR/docs/Web/Guide/CSS/CSS_Media_queries [3]: https://drafts.csswg.org/css-values/#viewport-relative-lengths