JSFiddle - React, Tailwind, and code Playground

by methodfish

HTML

<script src="https://methodfish.com/Download/MFColumnGradient/files/latest/js/mf-column-gradient.js"></script>
<table id='myTable'>
  <tr>
    <td>A</td>
    <td>65</td>
  </tr>
  <tr>
    <td>B</td>
    <td>66</td>
  </tr>
  <tr>
    <td>C</td>
    <td>67</td>
  </tr>
  <tr>
    <td>D</td>
    <td>68</td>
  </tr>
</table>

CSS

table#myTable {
      border-collapse:collapse;
      margin:10px;
      width:200px;
    }
    #myTable td {
       border:solid 1px grey
    }

JavaScript

window.addEventListener('load',function() {
    const colN=1; // columns start at 0 (so 2 is the third column)
    const lowValueCol='005500';
    const highValueCol='00FF00';
    const tableId='myTable';
    
    const gradient = new MFColumnGradient(tableId, lowValueCol, highValueCol);
    gradient.setColumnGradient(colN);
});