Image Color Picker

Pick colors from images by specifying coordinates. Get color values in HEX, RGB, HSL, HSV, and CMYK formats.

Click to upload file or drag and drop file here

Maximum file size: 20MB Supported formats: image/jpeg, image/png, image/webp, image/gif, image/bmp, image/tiff

Upload any image file to pick colors from

X coordinate in pixels, counting from the left edge (0 = left edge)

Y coordinate in pixels, counting from the top edge (0 = top edge)

Radius of area to sample (0 = single pixel, higher values average colors in the area)

Choose which color format(s) to include in the output

Key Facts

Category
Design & Color
Input Types
file, number, select
Output Type
json
Sample Coverage
4
API Ready
Yes

Overview

The Image Color Picker allows you to extract precise color values from any image by specifying pixel coordinates. Simply upload your image, set the X and Y coordinates, and retrieve the color in HEX, RGB, HSL, HSV, or CMYK formats, with optional color averaging using a sample radius.

When to Use

  • •When you need to extract the exact color value of a specific pixel in an image for design or development projects.
  • •When you want to sample and average colors over a small area of an image to avoid noise or compression artifacts.
  • •When you need to convert a pixel color from an image directly into multiple formats like CMYK, HSV, HSL, RGB, or HEX.

How It Works

  • •Upload an image file in JPEG, PNG, WebP, GIF, BMP, or TIFF format.
  • •Specify the target X and Y pixel coordinates, counting from the top-left corner of the image.
  • •Optionally set a sample radius to average the color of surrounding pixels, and select your preferred output format.
  • •Run the tool to generate a JSON output containing the precise color values.

Use Cases

Extracting brand colors from a logo image at specific coordinates.
Analyzing color values in digital assets for quality control and design consistency.
Sampling average background colors from photos to match UI elements.

Examples

1. Extracting Brand Color from a Logo

UI Designer
Background
A designer needs to match the exact blue color from a company logo image to use in a web application stylesheet.
Problem
The logo has slight gradients, and the designer needs the exact color at a specific coordinate in HEX format.
How to Use
Upload the logo PNG file, set the X coordinate to 120, the Y coordinate to 80, set the sample radius to 0, and select HEX as the output format.
Example Config
imageFile: logo.png, x: 120, y: 80, sampleRadius: 0, outputFormat: hex
Outcome
The tool returns the exact HEX color code #0055ff for the specified pixel.

2. Averaging Color from a Textured Photo

Frontend Developer
Background
A developer wants to set a matching background color for a card component based on a textured product photo.
Problem
Single-pixel sampling on textured images yields inconsistent colors due to noise.
How to Use
Upload the product photo, set coordinates to X: 300, Y: 450, set the sample radius to 15 pixels to average the area, and choose all formats.
Example Config
imageFile: product.jpg, x: 300, y: 450, sampleRadius: 15, outputFormat: all
Outcome
The tool outputs a JSON object containing the averaged HEX, RGB, HSL, HSV, and CMYK values of the 15-pixel radius area.

Try with Samples

image, png, jpg
Web Image Processing Python Samples
Web Python image processing examples using PIL/Pillow including reading, saving, resizing, and format conversion
title token image
image
Android Image Processing Java Samples
Android Java image processing examples including reading/saving images, scaling, and format conversion
title token image
image
Android Image Processing Kotlin Samples
Android Kotlin image processing examples including reading/saving images, scaling, and format conversion
title token image
image
macOS Image Processing Objective-C Samples
macOS Objective-C image processing examples including image reading/saving, image scaling, and format conversion
title token image
image

Related Hubs

Image Format Conversion and Animated Export Tools
Compare image format converters for JPG, PNG, GIF, AVIF, WebP, TIFF, ICO, base64, and animation-friendly exports in one hub.
Image Cleanup, Framing, and Batch Prep Tools
Compare image cleanup, trimming, padding, framing, batch resize/compress, watermarking, and visual polish tools in one hub for asset preparation workflows.
Image Metadata, EXIF, and Privacy Cleanup Tools
Compare image metadata viewers, EXIF/IPTC/XMP inspectors, orientation fixers, metadata editors, and privacy cleanup tools for photo publishing workflows.
Audio Encoding and Format Conversion Tools
Compare audio format conversion, bitrate changes, sample-rate conversion, codec swaps, and export tools in one hub for delivery and archive workflows.

FAQ

What image formats are supported?

The tool supports JPEG, PNG, WebP, GIF, BMP, and TIFF files up to 20MB.

How do the X and Y coordinates work?

The X coordinate represents pixels from the left edge, and the Y coordinate represents pixels from the top edge, starting at 0.

What does the sample radius option do?

A radius of 0 samples a single pixel. Higher values (up to 50) average the colors within that pixel radius to smooth out noise.

Can I get colors in CMYK format?

Yes, you can choose to output CMYK values along with HEX, RGB, HSL, and HSV.

Is there a limit to the image file size?

Yes, the maximum supported file size for uploaded images is 20MB.

API Documentation

Request Endpoint

POST /en/api/tools/image-color-picker

Request Parameters

Parameter Name Type Required Description
imageFile file (Upload required) Yes Upload any image file to pick colors from
x number Yes X coordinate in pixels, counting from the left edge (0 = left edge)
y number Yes Y coordinate in pixels, counting from the top edge (0 = top edge)
sampleRadius number No Radius of area to sample (0 = single pixel, higher values average colors in the area)
outputFormat select No Choose which color format(s) to include in the output

File type parameters need to be uploaded first via POST /upload/image-color-picker to get filePath, then pass filePath to the corresponding file field.

Response Format

{
  "key": {...},
  "metadata": {
    "key": "value"
  },
  "error": "Error message (optional)",
  "message": "Notification message (optional)"
}
JSON Data: JSON Data

AI MCP Documentation

Add this tool to your MCP server configuration: 

{
  "mcpServers": {
    "elysiatools-image-color-picker": {
      "name": "image-color-picker",
      "description": "Pick colors from images by specifying coordinates. Get color values in HEX, RGB, HSL, HSV, and CMYK formats.",
      "baseUrl": "https://elysiatools.com/mcp/sse?toolId=image-color-picker",
      "command": "",
      "args": [],
      "env": {},
      "isActive": true,
      "type": "sse"
    }
  }
}

You can chain multiple tools, e.g.: `https://elysiatools.com/mcp/sse?toolId=png-to-webp,jpg-to-webp,gif-to-webp`, max 20 tools.

Supports URL file links or Base64 encoding for file parameters.

If you encounter any issues, please contact us at [email protected]