JSFiddle - React, Tailwind, and code Playground

HTML

<table class="table">
    <tr>
        <td>Apple</td>
        <td>Banana</td>
    </tr>
    <tr id="colorme">
        <td>Carrot</td>
        <td>Tomato</td>
    </tr>
    <tr>
        <td>Juice</td>
        <td>Water</td>
    </tr>
</table>

CSS

table{
    border: 1px solid #999;
}

#colorme{
background-color: rgba(240, 0, 0, 0.901961);
-moz-transition: background-color 1s cubic-bezier(1,1,1,1);
-moz-transition-delay: 0.5s;
-ms-transition: background-color 1s cubic-bezier(1,1,1,1);
-ms-transition-delay: 0.5s;
-o-transition: background-color 1s cubic-bezier(1,1,1,1);
-o-transition-delay: 0.5s;
-webkit-transition: background-color 1s cubic-bezier(1,1,1,1);
-webkit-transition-delay: 0.5s;
transition: background-color 1s cubic-bezier(1,1,1,1);
transition-delay: 0s;
}

#colorme:hover {
    background-color: rgb(240, 240, 240);
}