Pick Colors from Any Pixel
Open kinja-img.com/color-picker, drop any image, and hover your cursor over it. The color panel updates in real time showing the exact color under your cursor. Click to lock in a color and copy its value.
The tool renders your image on an HTML5 Canvas and reads pixel data directly — every color you see is the actual pixel value, not an approximation.
HEX, RGB & HSL Output
Every picked color is displayed in three formats simultaneously:
- HEX —
#FF5060— the standard for web CSS and design tools - RGB —
rgb(255, 80, 96)— used in CSS, JavaScript, and most programming languages - HSL —
hsl(354, 100%, 66%)— intuitive for adjusting hue, saturation, and lightness
Click any value to copy it to your clipboard instantly. A "Copied" indicator confirms the action.
Auto Palette Extraction
When you load an image, the tool automatically extracts the 10 most dominant colors into a palette grid. The algorithm samples approximately 5,000 pixels across the image and uses color quantization to identify the key colors.
This is useful for:
- Extracting a brand color palette from a logo or product photo
- Finding the dominant mood colors in a photograph
- Building a complementary color scheme from an inspiration image
Click any palette color to copy its HEX value.
Color History
Every color you click on the image is saved to a history panel during your session. This lets you:
- Compare multiple colors side by side
- Go back to a previously picked color without finding the exact pixel again
- Build a custom palette by clicking different areas of the image
Click any color in the history to copy it again or re-display its values.
Use Cases for Designers & Developers
- Web design — match colors from a mockup or reference image to CSS variables
- Brand consistency — extract exact HEX values from logos for brand guidelines
- Photo editing — find specific color values to use in retouching or compositing
- Data visualization — pick colors from charts or maps to recreate them
- Accessibility — extract foreground and background colors to check contrast ratios
The entire tool runs in your browser. Images are never uploaded — all pixel reading happens locally via Canvas API. Supports JPG, PNG, GIF, and WebP.