I have this beautiful demo :) where you can sample the #dress colour under your cursor: https://michaelbach.de/ot/col-dress/
And a bug haunted me on this – sometimes the colours where drawn from totally wrong positions. Today I solved the puzzle: it depends on device resolution, specifically “retina displays” versus “non-retina…”. On nearly all platforms we have now display resolutions which are more than 5 times higher than the traditional 72 dpi. This is dealt with largely successfully by modern browsers. In my case, on high-resolution devices the coordinates of the mouse cursor have to be multiplied with “Window.devicePixelRatio” (https://developer.mozilla.org/en-US/docs/Web/API/Window/devicePixelRatio)
to correctly index into the image to extract its colour values. Ok, one problem solved – life has more for me.