This is a React web app written in TypeScript. It utilizes the Eye Dropper Web API to determine what colors are in an image. I built this application in an effort to understand how applications like Figma and the ColorPick EyeDropper chrome extension are able to determine what colors are displayed on your screen. As it turns out, it is fairly easy.
This app allows you to upload images and by using the Eye Dropper Web API you are able create an eye dropper instance to sample pixels on your screen and determine what colors are in the uploaded image. Because the eye dropper is not limited to sampling pixels in the browser, it can also be used to sample pixels outside of the browser. Once a color is selected it returns the value in Hex and RGB values.