JSFiddle - React, Tailwind, and code Playground

by Emmanuel Ndubuisi

HTML

<p>
  <span class="red-text">Red </span> <!-- RED TEXT -->
  <span class="orange-text">Orange</span> <!-- ORANGE TEXT -->
  <span class="yellow-text">Yellow </span> <!-- YELLOW TEXT -->
  <span class="green-text">Green</span> <!-- GREEN TEXT -->
  <span class="blue-text">Blue</span> <!-- BLUE TEXT -->
  <span class="indigo-text">Indigo</span> <!-- INDIGO TEXT -->
  <span class="violet-text">Violet</span> <!-- VIOLET TEXT -->
</p>

CSS

.red-text {
  color:  red;
}

.orange-text {
  color:  orange;
}

.yellow-text {
  color:  yellow;
}

.green-text {
  color:  green;
}

.blue-text {
  color:  blue;
}

.indigo-text {
  color:  indigo;
}

.violet-text {
  color:  violet;
}