I am using Vue 2, on the html I have an image which has white background, with a colorful object on the middle. Is it possible to detect and change the mouse cursor, based on the background color of where the mouse cursor is? Like, when on the white parts, against the actual object image (anything not-white).

Let's say it's an image like this. I want the cursor to change to pointer anywhere on the image where the background is not white.

https://www.vecteezy.com/vector-art/2751371-apple-with-a-white-background

Note: JQuery is not an option on this project

Thanks.