JSFiddle - React, Tailwind, and code Playground

HTML

<p id="three">Some text</p>
<p id="four">Some text</p>
<p id="five">Some text</p>
<p id="six">Some text</p>
<p id="seven">Some text</p>

CSS

body {
  font-family: Dejavu Sans;
}
#three {
    font-size: 10.0px;
}
#four {
    font-size: 10.5px;
}
#five {
    font-size: 11.0px;
}
#six {
    font-size: 11.5px;
}
#seven {
    font-size: 12.0px;
}