JSFiddle - React, Tailwind, and code Playground
HTML
<body>
<canvas id="myCanvas">
Your browser does not support the canvas element.
</canvas>
<div id="color" >Color</div>
</body>
JavaScript
var color = document.getElementById("color");
var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d');
var imageObj = new Image();
imageObj.onload = function() {
context.drawImage(imageObj, 0, 0);
};
imageObj.crossOrigin = "";
imageObj.src = 'http://www.fotos.org/galeria/data/900/Honshu-ciudad-Japon-wallpaper.jpg';
canvas.onmousemove = function(e) {
var x = e.clientX;
var y = e.clientY;
// set color now
var canvasColor = context.getImageData(x, y, 1, 1).data; // rgba e [0,255]
var r = canvasColor[0];
var g = canvasColor[1];
var b = canvasColor[2];
color.style.backgroundColor = 'rgb(' + r + ',' + g + ',' + b + ')';
}