Data Table

<table>
  <thead>
    <tr>
      <th>Country</th>
      <th>Code</th>
      <th>Population</th>
      <th>GDP</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td class="country-cell">
        <img src="https://cdn.freeflags.org/flat-circle/
             united-states-flag-flat-circle-64.png"
             width="24" height="24" alt="" />
        United States
      </td>
      <td>US</td>
      <td>331M</td>
      <td>$25.5T</td>
    </tr>
    <!-- more rows... -->
  </tbody>
</table>

table {
  width: 100%; border-collapse: collapse;
}

th, td {
  padding: 12px 16px; text-align: left;
  border-bottom: 1px solid #dce4ef;
  font-size: 14px;
}

th {
  background: #f8fafd; font-size: 12px;
  text-transform: uppercase; color: #34445c;
}

.country-cell {
  display: flex; align-items: center; gap: 10px;
}

.country-cell img {
  width: 24px; height: 24px;
  border-radius: 50%; object-fit: contain;
}