JSFiddle - React, Tailwind, and code Playground

by M Shameer

HTML

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Funnel+Sans:ital,wght@0,300..800;1,300..800&display=swap" rel="stylesheet">


Font size: 16px<br>
<div class="cf-question__text px16">*Please rate your overall satisfaction with your recent email correspondence. </div><br>
Font size: 17px<br>
<div class="cf-question__text px17">
*Please rate your overall satisfaction with your recent email correspondence.</div><br>
Font size: 16px and font weight medium<br>
<div class="cf-question__text px16 medium">*Please rate your overall satisfaction with your recent email correspondence. </div><br>
Font size: 17px and font weight medium<br>
<div class="cf-question__text px17 medium">
*Please rate your overall satisfaction with your recent email correspondence.</div><br>
Font size: 16px and font weight medium and bold in the middle<br>
<div class="cf-question__text px16 medium">*Please rate your <strong>overall satisfaction</strong> with your recent email correspondence. </div><br>
Font size: 17px and font weight medium and bold in the middle<br>
<div class="cf-question__text px17 medium">
*Please rate your <strong>overall satisfaction</strong> with your recent email correspondence.</div>

CSS

body{
    font-family: "Funnel Sans", sans-serif;
}

.px16{
  font-size:16px;
}
.px17{
  font-size:17px;
}
.medium{
  font-weight:500;
}