Image Color Picker
Pick colors from images with pixel precision. Extract dominant palettes, inspect HEX, RGB, HSL, HSV, CMYK, check WCAG contrast, and export swatches. 100% private & client-side.
Pick Colors from Any Image
Select or drop an image above to zoom into individual pixels with the precision loupe, sample HEX/RGB values, generate matching harmonies, and check WCAG contrast.
Online Image Color Picker & Palette Extractor
Inspect, sample, and extract exact colors from any image instantly in your web browser. Built for web designers, frontend developers, and digital artists who need fast, accurate color codes.
- 100% Client-Side Privacy: All images are processed locally in your browser and are never uploaded to any cloud server.
- Precision Loupe Magnifier: Zoom in up to 400% and inspect an enlarged 9×9 pixel grid with crosshairs and live coordinates.
- Comprehensive Color Formats: Instant conversion to HEX, HEX8, RGB, HSL, HSV, CMYK, and closest CSS color names.
- WCAG 2.1 Accessibility: Calculate relative luminance and contrast ratios against white and black backgrounds with AA/AAA pass badges.
- Color Harmonies & Palette Export: Generate complementary, analogous, triadic, and monochromatic schemes with 1-click export to CSS Variables, Tailwind, or JSON.
How to Pick Colors from an Image
Extract color codes and build palettes in four simple steps:
- Upload: Drag & drop any PNG, JPG, WebP, GIF, or SVG image into the dropzone.
- Inspect: Move your cursor across the image canvas to see the magnified loupe and live coordinates.
- Sample: Click on any pixel or dominant palette swatch to view detailed color codes and contrast metrics.
- Export: Copy individual color codes (HEX/RGB/HSL) or export your entire saved palette as CSS Variables, Tailwind config, or JSON.
You might also like
Frequently Asked Questions
No! All image rendering, pixel inspection, and color extraction happen 100% locally in your web browser using HTML5 Canvas. Your photos and graphics never leave your device.
Yes, once this page is loaded, the tool works completely offline. You can disconnect your internet connection and continue picking colors, generating harmonies, and extracting palettes without interruption.
The tool automatically converts sampled colors into HEX, HEX8 (with alpha), RGB, RGBA, HSL, HSLA, HSV/HSB, CMYK, and the closest matching standard CSS color name.
Point Sample (1x1) picks the exact color of the single pixel under your cursor. Area Sampling (3x3 or 5x5) calculates the arithmetic average color of a 9-pixel or 25-pixel grid, which is ideal for noisy photographs, compression artifacts, and textured artwork.
The tool calculates the mathematical relative luminance of your picked color and measures its contrast ratio against pure white (#FFFFFF) and pure black (#000000). It displays Pass/Fail ratings for WCAG AA and AAA standards across normal text, large headings, and graphical UI components.
Using scientifically verified spectral transformation matrices, the simulator accurately models how your chosen color appears to individuals with Protanopia (red-blind), Deuteranopia (green-blind), Tritanopia (blue-blind), and Achromatopsia (monochrome).
You can export your session's saved palette with one click in multiple developer-friendly formats, including CSS Variables (:root), Tailwind CSS configuration code, JSON, and a plaintext summary receipt.