JSFiddle - React, Tailwind, and code Playground

by khamer

HTML

<main>
  <article>
    <h2>Lorem ipsum dolor</h2>

    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Mollitia a cumque dolorem iste quo, quod officia odit, illo nam assumenda! Nihil reprehenderit libero aliquam nulla!</p>
  </article>

  <div class="dark">
    <article>
      <h2>Lorem ipsum dolor</h2>

      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Mollitia a cumque dolorem iste quo, quod officia odit, illo nam assumenda! Nihil reprehenderit libero aliquam nulla!</p>
    </article>
  </div>
</main>

CSS

:root {
  --color: black;
  --bg: transparent;
}

article {
  padding: 2em;
  
  color: var(--color);
  background-color: var(--bg);
}

.dark {
  --color: white;
  --bg: black;
}