Color Picker Spoid & Palette Web Page With Clipboard Image

Introducing a free web page that can be useful for development or design work. 

It provides basic color palettes and allows you to extract desired colors by selecting a desired file or loading an image that is copied to the clipboard.

 

Page Link

https://myfavoriteutil.com/colorpalette

Spoid Color Picker Tool

 

Function 1: Color Picker & Display

The basic UI displays various shapes of palettes, text boxes, and color codes as shown below. When you select a color from any palette, the color code changes and most buttons and text boxes change to the selected color. You can see the Hex color code and R, G, B values, and by pressing the Copy button next to it, you can copy the color code in "#rrggbb" format that can be used directly for CSS work.
And if you turn on the auto copy option at the top, the selected color will be automatically copied to the clipboard.

Function 2: Spoid from image

The "Spoid From Your Image" section below provides a function to select colors from an image instead of a palette. There are two ways to load an image:

- Press the file selection on the left to select an image file on your PC.

- Press From Clipboard button on the right after copying the image with Ctrl+C.

 

Personally, I think the second function is the most useful because it's too annoying to save files, and often we just want to capture and extract colors while searching the internet. When you press the button for the first time, you will see a permission request like below and you need to allow it.

Now, all you have to do is press the button with the image copied from somewhere on the web. For testing purposes, I searched for an image on Google and captured it with a capture tool and copied the image with Ctrl+C. After copying, return to the Color Picker webpage and press the "From Clipboard" button, and the image will be displayed immediately below.

When you hover the mouse cursor over the image, the cursor is displayed as a crosshair, and when you click on the desired point, the color is selected just like when you select it from the palette above.

 

Function 3: Color Set - Basic/Pastel/Calming/Halloween

In the middle, there are buttons for basic, pastel, calming, and Halloween, and when you press them, the color palette changes as shown below. You can easily extract the desired tone of color.