Color Picker & ConverterPick a colour, convert between HEX, RGB and HSL, sample colours from an image or your screen, and check contrast against white and black text.
Color Palette Generator
Build a coherent palette from one brand colour using colour-wheel harmonies, or pull the main colours out of a photo. Copy individual values or export CSS custom properties.
Choose an image
Runs entirely in your browser. Your input and files are not uploaded to any server.
How to use
- Choose a base colour and a harmony type — or switch to “From image” and open a picture.
- Click any swatch to copy its HEX code.
- Copy the CSS variables to use the palette in your stylesheet.
Examples
Interface colour scale
Use “Tints & shades” to get light backgrounds and dark text variants of your primary colour.
Palette from a product photo
Extract 6 colours from the photo to style a landing page that matches it.
Privacy
Runs entirely in your browser. Your input and files are not uploaded to any server. See the privacy policy for what is stored in your browser (favorites and history only). Privacy policy
Check it yourself: open your browser’s developer tools, select the Network tab and use the tool. Your file never appears in an upload request. Once this page is saved for offline use, you can also disconnect from the internet and keep working. Ads and anonymous visit statistics, when enabled, make their own requests, but they never receive your files or text.
Frequently asked questions
How are image colours extracted?
The image is downscaled and its pixels are grouped with a k-means clustering algorithm; the largest clusters become the palette.
Are the harmonies accessible?
Harmonies are about hue relationships, not contrast. Check text and background pairs with the Color Picker’s contrast ratio.
Related tools
All Image ToolsFavicon GeneratorGenerate a complete favicon set from an image or a letter: favicon.ico, 16–512 px PNGs, Apple touch icon, web manifest and HTML tags, in one ZIP.
SVG Preview & OptimizerPreview SVG files safely and shrink them by removing comments, editor metadata and whitespace, with optional number rounding.
Meta Tag GeneratorGenerate clean HTML meta tags for a page: title, description, canonical, robots, Open Graph and Twitter Card tags, with length guidance.
Image CompressorCompress JPG, PNG and WebP images in your browser by quality or to a target size such as 100 KB.
Image ResizerResize JPG, PNG and WebP images to exact pixel dimensions or a percentage, with optional aspect-ratio lock.