Responsive Typo

Font-size based on your screen-size... In pure css please. Here's a way to do it: put a base font-size in a calc-function together with a viewport height and a viewport width value. Magic. Source

h1 {
    font-size: calc(2rem + 4vh + 4vw);

Or make your base font-size responsive...

html {
    font-size: calc(100% + .2vh + .2vw);

Or create text that always fills the viewport. No matter what ratio. Source

p {
    font-size: calc(4vw + 4vh + 2vmin);


For a little demo of this awesome sause:
Small Demo - Responsive Base Typo