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
  • RGBrgb(255, 80, 96) — used in CSS, JavaScript, and most programming languages
  • HSLhsl(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.

Open Color Picker →