JSFiddle - React, Tailwind, and code Playground

HTML

<table>
  <tbody>
    <tr><th>1</th><td>1</td></tr>
    <tr><th>1</th><td>1</td></tr>
    <tr><th>1</th><td>1</td></tr>
    <tr><th>2</th><td>2</td></tr>
    <tr><th>2</th><td>2</td></tr>
    <tr><th>2</th><td>2</td></tr>
    <tr><th>3</th><td>3</td></tr>
    <tr><th>3</th><td>3</td></tr>
    <tr><th>3</th><td>3</td></tr>
    <tr><th>4</th><td>4</td></tr>
    <tr><th>4</th><td>4</td></tr>
    <tr><th>4</th><td>4</td></tr>
    <tr><th>5</th><td>5</td></tr>
    <tr><th>5</th><td>5</td></tr>
    <tr><th>5</th><td>5</td></tr>
    <tr><th>6</th><td>6</td></tr>
    <tr><th>6</th><td>6</td></tr>
    <tr><th>6</th><td>6</td></tr>
  </tbody>
  <tbody>
    <tr><th>7</th><td>7</td></tr> 
    <tr><th>7</th><td>7</td></tr> 
    <tr><th>7</th><td>7</td></tr> 
    <tr><th>8</th><td>8</td></tr>
    <tr><th>8</th><td>8</td></tr>
    <tr><th>8</th><td>8</td></tr>
  </tbody>
</table>

CSS

table {
  border-collapse: collapse;
}
th, td {
  border: 1px solid black;
  padding: 4px;
}
tbody:before {
  content: 'new tbody';
}

tr:nth-child(even):nth-child(3n-1) {
  background-color: steelblue;
}

tr:nth-child(odd) {
  background: steelblue;
}

tr:nth-child(odd):nth-child(6n-1) {
  background: white;
}