Color Palette from Photo
A color palette from a photo is a set of dominant colors extracted from an image, usually returned as hex codes (e.g. #3B82F6), RGB, or HSL values. PhotoTones is a free color palette from image generator that extracts up to 12 colors from any photo in under a second — entirely in your browser.
How to Generate a Color Palette from a Photo (3 Steps)
- Open phototones.com in any modern browser. No signup or download is required.
- Upload a photo. Click "Choose an image" and select any JPG, PNG, GIF, WebP, BMP, or SVG file from your device.
- Click "Generate Color Palette". PhotoTones runs the Vibrant.js algorithm locally and displays up to 6 categorized colors (Vibrant, Dark Vibrant, Light Vibrant, Muted, Dark Muted, Light Muted). Pro users can extend to 8, 10, or 12 colors via a ColorThief-powered hybrid extraction.
Ready to try it?
Drop a photo, get a palette. Free, private, no signup.
Open the Color Palette from Image GeneratorWhat You Get for Every Photo
- Hex codes (e.g.
#1e3a8a) — ready to paste into CSS, Figma, Sketch, or any design tool - RGB values (e.g.
rgb(30, 58, 138)) — for CSSbackground-color, canvas, or native mobile styling - HSL values (e.g.
hsl(224, 64%, 33%)) — ideal for generating tints, shades, and design tokens - One-click copy per swatch, plus "Copy All HEX", "Copy All RGB", and "Copy All HSL"
- Composite download — a JPEG (or lossless PNG on Pro) with the swatches attached to your photo, perfect for mood boards and style guides
Why Extract a Color Palette from a Photo?
Designers, developers, photographers, and brand strategists use a color palette from image generator for different reasons:
- Brand identity. Extract the primary and accent colors from a logo or product shot to keep your palette consistent across every touchpoint.
- Web and UI design. Derive a cohesive color scheme from a single hero image so your entire site feels intentional.
- Interior design. Photograph a room, a piece of furniture, or a fabric swatch, and plan complementary paints and decor.
- Photography and film. Analyze the dominant color story of a frame and match it in post-production or color grading.
- Art and illustration. Study the color harmony of masters by extracting the underlying palette of their work.
How PhotoTones Extracts Colors
PhotoTones uses a hybrid algorithm:
- Vibrant.js identifies six perceptually distinct color categories (Vibrant, Dark Vibrant, Light Vibrant, Muted, Dark Muted, Light Muted) using the Android Palette API approach.
- ColorThief (Pro) supplements the base 6 with additional dominant colors via k-means clustering, scaling to 8, 10, or 12 total colors.
- A Euclidean distance filter (threshold of 30 in RGB space) removes near-duplicate swatches so every color in your palette is visually distinct.
- Colors are sorted by HSL hue for a harmonious final display.
Frequently Asked Questions
How do I get a color palette from a photo?
Open phototones.com, click "Choose an image" to upload a photo, then click "Generate Color Palette". PhotoTones extracts up to 12 dominant colors with hex, RGB, and HSL codes in under a second — all in your browser.
Is the color palette generator from a photo free?
Yes. PhotoTones is free to use with no signup, no account, and no usage limits. Pro ($7/month, cancel anytime) adds professional exports like Adobe ASE, Tailwind config, SCSS variables, lossless PNG downloads, and a WCAG contrast grid.
Does PhotoTones upload my photo to a server?
No. PhotoTones uses the HTML5 Canvas API and the Vibrant.js algorithm to process every photo locally in your browser. Your image data is never transmitted, stored, or shared — it's safe to use with confidential assets.
How many colors can I extract from a photo?
The free version extracts up to 6 dominant colors per photo. PhotoTones Pro extends this to 8, 10, or 12 colors using a hybrid Vibrant.js + ColorThief extraction — ideal for larger design systems and extended brand palettes.
What photo formats are supported?
JPG, JPEG, PNG, GIF, WebP, BMP, SVG, and any other format your browser can display. Most camera outputs (including iPhone HEIC when converted to JPG) are fully supported.