JSFiddle - React, Tailwind, and code Playground

HTML

<ul id="main">
    <li class="article">1</li>
    <li class="article">2</li>
    <li class="article">3</li>
    <li class="article">4</li>
    <li class="article">5</li>
    <li class="article">6</li>
    <li class="article">7</li>
    <li class="article">8</li>
    <li class="article">9</li>
    <li class="article">10</li>
    <li class="article">11</li>
    <li class="article">12</li>
        <li class="article">13</li>
    <li class="article">14</li>
    <li class="article">15</li>
    <li class="article">16</li>
    <li class="article">17</li>
    <li class="article">18</li>
    <li class="article">19</li>
    <li class="article">20</li>
    <li class="article">21</li>
    <li class="article">22</li>
    <li class="article">23</li>
    <li class="article">24</li>
</ul>

CSS

.article:nth-child(6n+6),
.article:nth-child(6n+6) + li{
    opacity: 0.4;
}