JSFiddle - React, Tailwind, and code Playground

HTML

<h1>boodschappenlijst</h1>
<h2>food</h2>
<h3>groenten en fruit</h3>
<ul>
  <li>appels</li>
  <li>peren</li>
  <li>bananen</li>
  <li>rodekool</li>
  <li>wortels</li>
  <li>prei</li>
</ul>
<h3>vlees</h3>
<ul>
  <li>steak</li>
  <li>varkenslam</li>
  <li>kipkrokant</li>
</ul>
<h3>andere</h3>
<ul>
  <li>choco</li>
  <li>speculoos</li>
  <li>koffie</li>
</ul>
<h2>non food</h2>
<ul>
  <li>sierplantje</li>
  <li>wc-papier</li>
</ul>

CSS

ul {
  color: red;
  background-color: lightblue;
}
ol {
  color: darkviolet;
  background-color: lightblue;
}
h1 {
  color: blue;
  background-color: red;
}
h2 {
  color: purple;
  background-color: pink;
}
h3 {
  color: green;
  background-color: yellow;
}
html{background-color:black