JSFiddle - React, Tailwind, and code Playground

HTML

<div>
abcd
</div>
<p>
xyz
</p>

CSS

.hover {
    background-image:linear-gradient(to bottom, rgba(124, 182, 255, 0.7) 0%, rgba(124, 182, 255, 0.7) 100%), linear-gradient(to bottom, rgba(255, 170, 124, 0.5) 0%, rgba(255, 170, 124, 0.5) 100%);
    background-clip: content-box, padding-box;
}

div {
  padding: 5px;
}

JavaScript

$('*').mouseover((e) => $(e.target).addClass('hover'));
$('*').mouseout((e) => $(e.target).removeClass('hover'));