JSFiddle - React, Tailwind, and code Playground

HTML

<div>
<p>
Trascina lo slider per cambiare il colore dell'immagine (hue rotation)
</p>
<input type="range" min="0" max="360" style="width: 188px" value="0" id="hue" name="hue" oninput="coloraImmagine(this.value)" />
</div>
<div>
<img src="https://courses.engr.illinois.edu/cs225/fa2017/labs/intro-2/hue.png" width="200" style="position:relative; left: -5px;" />
</div>
<br>
<div>
<img id="immagine" src="https://ae01.alicdn.com/kf/HTB1mqz4IpXXXXbjXVXXq6xXFXXXB/PU-Soccer-Ball-Kid-Child-Playing-Small-Extra-Strong-Sports-Soccer-Football-Size-2-15cm-Random.jpg" width="400" />
</div>

JavaScript

function coloraImmagine(hue) {
	var img = document.getElementById('immagine');
  img.style.filter = 'hue-rotate('+hue+'deg)';
}
coloraImmagine(0);