JSFiddle - React, Tailwind, and code Playground
HTML
<h1>Using webfont:</h1>
<p class="nunito-sans"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. In sit amet aliquam elit. Nullam id ex metus. Vivamus elementum egestas blandit. Etiam id lacus pretium risus pellentesque condimentum. Quisque auctor arcu quis quam facilisis tempor. Vestibulum viverra erat tellus, eu egestas purus maximus in. Ut in orci vel ex faucibus lacinia eu sed ante. Quisque dignissim, risus eu fringilla maximus, dolor diam bibendum neque, nec porttitor erat mi eu libero. Phasellus in lacus id libero mattis ornare a id elit. In et rutrum metus, quis egestas arcu. Donec ac nisi sollicitudin, volutpat ligula accumsan, tempus nisl. Donec volutpat viverra magna sit amet sollicitudin. Phasellus accumsan, ex vel dignissim posuere, enim elit luctus dui, efficitur elementum nisi leo non nisl. Proin vestibulum eu dui quis convallis. Quisque ornare neque eu erat facilisis, non semper felis dignissim.
</p>
<h1>No webfont</h1>
<p>
Sed a lobortis mauris. Fusce facilisis nisi sed lobortis semper. Ut blandit magna ipsum, et viverra elit efficitur non. Pellentesque ut pellentesque purus, id interdum ipsum. Mauris nec felis arcu. Vivamus at nunc a quam tristique elementum. Suspendisse a nulla mi. Duis semper sodales urna, sit amet gravida orci porttitor quis. Donec auctor, massa quis dapibus consequat, urna mi consequat elit, nec vehicula lacus ex in tellus. Proin finibus viverra tortor, a laoreet ipsum gravida vel. </p>
CSS
@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&display=swap');
.nunito-sans {
font-family: "Nunito Sans", sans-serif;
font-optical-sizing: auto;
font-weight: 400;
font-style: normal;
font-variation-settings:
"wdth" 100,
"YTLC" 500;
}