JSFiddle - React, Tailwind, and code Playground

HTML

<label>font size:
  <input id="_size" value="14" type="number">
</label>

<h1>
  Heading
</h1>

<main>
  <div>
    Main body
  </div>

  <aside>Sidebar</aside>
</main>

CSS

html {
  font-size: 14px;
}

h1 {
  font-size: 2.4rem;
  line-height: 6rem;
  background: lightblue;
}

main {
  display: flex;
}

main div {
  flex-basis: 60%;
  font-size: 1.1rem;
}

aside {
  flex-basis: 35%;
  font-size: 1.6rem;
}

JavaScript

_size.oninput = e => {
  if (isFinite(e.target.value)) {
    document.querySelector('html').style.fontSize = e.target.value + 'px'
  }
}