JSFiddle - React, Tailwind, and code Playground

by vaheed akhtar

HTML

<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li>8</li>
</ul>
<hr />
<p>Paragraph 1</p>
<p>Paragraph 2</p>
<p>Paragraph 3</p>
<input type="range"/>

CSS

:root{
  --mycolor: green;
}
ul li:not(:nth-child(2n)){
  color: var(--mycolor);
}
p:first-of-type:first-letter{
  font-size: 20px;
  font-style: italic;
  font-weight: 700;
  color: var(--mycolor);
}