JSFiddle - React, Tailwind, and code Playground

by Raphael Quintao

HTML

<div style="font-family: Helvetica; ">
  <h2>Olá Maria Silva!</h2>

  <table border="0" style="display: table;
    border-collapse: separate;
    border-spacing: 0;
    margin: 0;
    font-size: 0.9em;
    border: 1px solid red;
    overflow: hidden;
    box-sizing: border-box;
    margin: 0px;
    border-color: var(--bg);
    font-family: inherit;
    border-radius: 10px;
    overflow: hidden;
    color: black;">
    <thead style="border-color: black; background-color: hsl(198, 80%, 33%);">
      <tr style=" color: #ffffff; text-align: center; border: 0px solid hsl(168, 100%, 25%);">
        <th style="padding: 12px 15px; border-color: inherit;"></th>
        <th style="padding: 12px 15px; border-color: inherit;">Referência</th>
        <th style="padding: 12px 15px; border-color: inherit;">Valor Referência</th>
        <th style="padding: 12px 15px; border-color: inherit;">Variação Percentual</th>
      </tr>
    </thead>
    <tbody style="border-color: inherit; background: #ddd;">
      <tr style="border-color: inherit; background-color: #ffffff;">
        <td rowspan="5" style="background-color: hsl(198, 80%, 33%); color:white; padding: 12px 15px; border-color: inherit;">
          <h2>Em 05/2022, foram 16.498 consultas</h2>
        </td>
      </tr>
      <tr style="border-color: inherit; background-color: #ffffff;">
        <td style="padding: 12px 15px; border-color: inherit;">Mesmo Período Ano Passado (2021)</td>
        <td style="padding: 12px 15px; border-color: inherit;">11.971</td>
        <td style="padding: 12px 15px; border-color: inherit;">+37.82%</td>
      </tr>
      <tr style="border-color: inherit;">
        <td style="padding: 12px 15px;  border-color: inherit;">Média Global</td>
        <td style="padding: 12px 15px; border-color: inherit;">10.693</td>
        <td style="padding: 12px 15px; border-color: inherit;">+54.29%</td>
      </tr>
      <tr style="border-color: inherit;background-color: #ffffff;">
        <td style="padding: 12px...

CSS

html, body {
  /* background: #1f2227; */
  /* color: #f1f1f1; */
}