JSFiddle - React, Tailwind, and code Playground

HTML

<table>
<tr>
  <td rowspan=2 colspan=10><div></div></td>
</tr>
<tr>
  <td></td>
  <td></td>
  <td></td>
</tr>
<tr>
  <td colspan=6></td>
  <td></td>
</tr>
<tr>
  <td colspan=3></td>
  <td colspan=3></td>
  <td></td>
</tr>
<tr>
  <td></td>
  <td></td>
  <td></td>
  <td></td>
  <td></td>
  <td></td>
  <td></td>
  <td></td>
  <td></td>
  <td></td>
  <td></td>
  <td></td>
  <td></td>
</tr>
</table>

CSS

table { border-spacing: 32px; background: yellow; }
td { height: 32px; background: rgba(0,255,0,0.7); }
div { height: 32px; width: 32px; background: rgba(0,0,255,0.7); }