Colour Palette EXTRACTOR
Pull the colours out of a photo and copy any of them as a hex code.
or drop images here
No upload · No size limit · No account
How to colour palette extractor
- Add an imagePhotograph, illustration, screenshot — anything with colour in it.
- Choose how many colours you wantSix is a good working palette. Ten if you want the quieter tones as well.
- Read the swatchesThey are ordered by how much of the image each colour covers, so the first is the dominant one.
- Click any swatch to copy its hex codeIt goes straight to your clipboard, ready to paste into CSS or a design tool.
When you need it
Building a design around a photograph
Taking colours from the image itself is the quickest way to make a layout feel like it belongs with the picture.
Matching a brand you do not have the files for
A screenshot of a logo gives you the hex codes without asking anyone.
Finding a colour that will sit well on an image
A colour drawn from the picture is guaranteed to be in the same family.
Questions
How are the colours chosen?
The image is scanned and every pixel is dropped into a coarse colour bucket. The busiest buckets win, and each result is the average of the pixels in it. Grouping first is what keeps it useful — averaging the whole image would just give you brown.
Why does it miss a colour I can clearly see?
Because the tool ranks by how much of the frame a colour covers. A small bright accent can be the most noticeable thing in a photo while occupying almost none of it. Asking for more colours usually brings it in, or crop to the area first.
What do I do with a hex code?
Paste it anywhere a colour is asked for — CSS, Figma, Photoshop, a website builder. The # is included when you copy.
How many colours should I take?
Five or six for a design palette; more than that and they start repeating each other. Eight or ten if you are studying an image rather than building from it.
Is my image uploaded to read the colours?
No. The image is drawn to a canvas in your browser and the pixels are read there. Nothing leaves your device.
More tools
Compress IMAGE
Shrink JPG, PNG and WebP files while keeping them sharp.
In your browserResize IMAGE
Set exact pixels or scale by percentage. Batch supported.
In your browserCompress to EXACT SIZE
Need it under 100 KB? Set the target and hit the number.
In your browserCrop IMAGE
Drag to crop, or lock to a ratio like 1:1 and 16:9.
In your browserImage to PDF
Combine images into one PDF, in the order you choose.
In your browserWatermark IMAGE
Stamp text or a logo over your images, in bulk.
In your browserQR Code GENERATOR
Turn a link or text into a QR code you actually own.
In your browserBeautify SCREENSHOT
Turn a plain screenshot into something worth posting.
In your browserAdd Text to IMAGE
Write over a photo — position, size, colour, outline.
In your browserPhoto FILTERS
Brightness, contrast, saturation, black and white.
In your browserRotate & FLIP
Turn a sideways photo upright, or mirror it.
In your browserCircle CROP
Crop into a circle with a transparent background.
In your browserAdd BORDER
Frame a photo, or give it a polaroid edge.
In your browserSplit Image into a GRID
Cut one image into tiles for a carousel or grid.
In your browserColour Palette EXTRACTOR
Pull the dominant colours out of a photo as hex.
In your browserSocial Media RESIZER
Exact sizes for Instagram, YouTube, LinkedIn and X.
In your browserImage to BASE64
A data URL you can paste straight into CSS or HTML.
In your browserBarcode GENERATOR
CODE128, EAN-13, UPC-A — as PNG or print-ready SVG.
In your browserInvert COLOURS
Flip every colour to its opposite — a negative.
In your browserBlack and White CONVERTER
Take the colour out, fully or partly.
In your browserSepia FILTER
The warm brown cast of an old print.
In your browserRound the CORNERS
Round the corners, transparent outside.
In your browserAdd a VIGNETTE
Darken the edges to pull focus inward.
In your browserSharpen IMAGE
Bring back edge definition after resizing.
In your browserBlur or Pixelate AN AREA
Cover faces, plates and details before sharing.
In your browserFavicon GENERATOR
One image, a full favicon set in a zip.
In your browserMerge IMAGES
Join images side by side or stacked.
In your browserMeme GENERATOR
Top and bottom text in the classic format.
In your browserBase64 to IMAGE
Paste a data URL, get the image file back.
In your browserPlaceholder GENERATOR
A plain image at any size, no upload needed.
In your browserPassport & ID PHOTO
Passport and ID sizes, plus a printable sheet.
In your browserCollage MAKER
Arrange photos into a grid with even spacing.
In your browserBulk Rename IMAGES
Rename a folder to a numbered pattern.
In your browserEXIF VIEWER
See the camera, date and GPS hidden in a photo.
In your browserCompare Two IMAGES
Slide between two images to spot the difference.
In your browserGradient GENERATOR
A gradient image at any size, no upload.
In your browserInitials AVATAR
An avatar from initials, square or round.
In your browserSignature MAKER
Draw a signature, get a transparent PNG.
In your browserDuotone EFFECT
Map a photo onto two colours.
In your browserPosterize IMAGE
Reduce a photo to flat blocks of colour.
In your browserAdd GRAIN
Add film grain for texture or to hide banding.
In your browserColour Picker from AN IMAGE
Click an image to read the exact colour.
In your browserBlur IMAGE
Blur a whole image, softly or heavily.
In your browserTrim WHITESPACE
Cut the blank border from around an image.
In your browserAspect Ratio CALCULATOR
Work out the size that keeps proportions.
In your browserRemove EXIF DATA
Strip GPS and camera data before sharing a photo.
In your browserConverters
How it works
Every tool here runs on the HTML Canvas API inside your own browser. When you drop a file, it is read straight into memory, changed there, and handed back as a download. Not one byte goes over the network — which is why there is no upload wait, no file size cap, and no way for anyone, including us, to see your images.
That also means the tools keep working with no connection once the page has loaded, and the only limit on file size is your device's memory.