Is my image uploaded?

No. The entire palette extraction runs in your browser. The image bytes never reach our servers and nothing is saved on disk. The only network traffic is a single Plausible analytics beacon (consent-gated) so we can count page views and successful extractions, with no payload.

How does the palette extractor pick the colours?

The tool first shrinks the image to 256 pixels on the longest edge (so the result is fast and predictable), then groups the pixels into the number of colour groups you asked for. Each group becomes one swatch, with its colour set to the average of the pixels in the group.

Why are some swatches marked dominant or accent?

When you ask for 5 or more colours, the largest cluster (by source pixel count) is tagged as the dominant colour and the next 4 as accents. The split is useful for design systems where you want to know which is the primary brand colour vs the supporting tones.

What WCAG tiers do the swatch badges use?

Standard WCAG 2.1 contrast ratios. AAA is 7 or higher, AA is 4.5 or higher, AA-Large is 3 or higher (large text only), and Fail is anything below 3. We compute the ratio against pure white and pure black so you can see at a glance whether a colour works for body copy, headlines, or only as a decorative accent.

Which export formats can I download?

Five: CSS custom properties (a :root block of --color-N variables), Tailwind theme.extend.colors, SCSS variables ($color-N: #...;), JSON (an array of objects with hex, rgb, hsl, contrastWhite, contrastBlack, and the WCAG tiers), and a 600 x 100 px PNG strip with one solid band per swatch in palette order.

Za darmo, bez rejestracji, nic nie zapisujemy

Extract a colour palette from any image, in your browser

Drop a photo and get its 3 to 12 most representative colours as hex, RGB, HSL, CSS custom properties, Tailwind theme colours, SCSS variables, JSON, or a 600 x 100 px PNG strip. Each swatch is annotated with its WCAG contrast tier against white and black. Image bytes never leave your browser.

Drop an image Convert image format instead

Processed 100% in your browser
No account required
Nothing uploaded

A rustic pasta photograph alone, then the same photograph with a six-colour palette row drawn beneath it.

Przeciągnij, aby porównać, przed / po

Every photo carries a colour story: a dominant tone, two or three supporting accents, and a long tail of edge-case pixels. Designers use that palette to build mood boards, brand systems, and accessible UI themes; developers reach for it when they want CSS variables that match a hero image without eyeballing the swatch.

The classic way to extract a palette is server-side: upload the image, the server crunches the colours, and a list of hex codes comes back. That round-trip is wasteful for what is, fundamentally, a few hundred milliseconds of in-memory math. It also means handing your image to a third party. Neither of those trade-offs is necessary.

BouseMutton runs the palette extractor in your browser. Drop an image; the browser shrinks it to 256 pixels on the longest edge (plenty of detail for palette work), groups the colours into the number of swatches you asked for, and renders them with WCAG contrast badges. The image never leaves the page. Five export formats are one click away: CSS custom properties, Tailwind theme.extend.colors, SCSS variables, JSON, and a 600 x 100 px PNG strip.

W skrócie

Quick facts

Liczby i kompromisy, które warto znać przed decyzją.

Where it runs
Processed 100% in your browser. Nothing is uploaded.
Palette size
Adjustable from 3 to 12 swatches via a UInputNumber. The dominant colour and 4 accents are tagged when size is 5 or more.
Export formats
CSS custom properties, Tailwind theme.extend.colors, SCSS variables, JSON, and a 600 x 100 px PNG swatch strip.
WCAG contrast
Each swatch is annotated AAA, AA, AA-Large, or Fail against pure white and pure black backgrounds.

Sposób działania

Jak to działa

Trzy kroki, zwykle w pięć sekund.

1
Drop an image
PNG, JPG, WebP, AVIF, or GIF up to 25 MB. Single image at a time. No sign-up, no credit card.
2
Pick the palette size
Choose how many colours you want: anywhere from 3 (just the brand essentials) to 12 (a full design-system palette).
3
Your browser does the work
Your browser shrinks the image to a thumbnail, groups the pixels into the number of colour groups you asked for, and returns one swatch per group. The whole pass takes a few hundred milliseconds for typical photos.
4
Export to your stack
Copy any swatch to your clipboard as hex, or download the full palette as CSS custom properties, a Tailwind theme.extend.colors block, SCSS variables, JSON (with WCAG contrast ratios baked in), or a 600 x 100 px PNG strip.

Przykłady

Zobacz w akcji

Przeciągnij każdy suwak, aby dokładnie obejrzeć efekt przed i po.

A Provence lavender field gives a warm purple and golden-wheat palette in six swatches with hex codes.

A dawn mountain lake pulls cool slate, pine green, and pale peak pink into a print-ready palette.

A Lisbon plaza scene returns pastel pink, butter yellow, and mint pulled straight from the building facades.

Prywatność

Twoje zdjęcie znika, gdy skończysz

Działa w Twojej przeglądarce

Palette extraction runs entirely in your browser. The image bytes never reach our servers, never touch disk, and are not used to train any model. The only network traffic is a single Plausible analytics beacon (consent-gated) carrying nothing but the page name and the resulting palette size. This is the strictest privacy tier we offer.

Gotowe w kilka sekund
Nic nie zapisujemy
Bez powiązania z kontem

Wypróbuj teraz

Prześlij zdjęcie

Jedno kliknięcie. Bez rejestracji. Resztą zajmiemy się my.

Wyodrębnij paletę kolorów

Obraz

Upuść tutaj swój obraz lub kliknij, aby przesłać

Upuść obraz (PNG, JPG, WebP, AVIF, GIF do 25 MB).

Rozmiar palety (od 3 do 12)

Przetwarzane w 100% w Twojej przeglądarce

Algorytm wyodrębniania kolorów działa wyłącznie w Twojej przeglądarce. Nic nie jest wysyłane, nic nie jest zapisywane.

Słowniczek

Palette glossary

Wyjaśnienia żargonu prostym językiem.

FAQ

Najczęściej zadawane pytania

Odpowiedzi na to, o co ludzie najczęściej pytają przed wypróbowaniem nowego narzędzia.

Więcej narzędzi

Powiązane narzędzia

Jedno kliknięcie do innych zadań, których to zdjęcie prawdopodobnie potrzebuje.

Compress image

Once you know the palette, you usually want to ship the image. Lossless and lossy compression in your browser, no upload.

Otwórz narzędzie

Convert PNG to AVIF

AVIF cuts the byte cost of a brand image roughly in half. Our converter pairs naturally with palette extraction for hero-image work.

Otwórz narzędzie

View EXIF metadata

Curious what is hidden in the image you just dropped? The viewer shows GPS, camera, and copyright tags without uploading anything.

Otwórz narzędzie

Cytujesz lub udostępniasz?

Skopiuj zwięzłe podsumowanie Markdown (tytuł, opis, FAQ, kanoniczny URL i sposób cytowania) gotowe do wklejenia w model AI lub dokument.

Zobacz wersję Markdown

Extract a colour palette from any image, in your browser

Przegląd

Quick facts

Jak to działa

Drop an image

Pick the palette size

Your browser does the work

Export to your stack

Zobacz w akcji

Twoje zdjęcie znika, gdy skończysz

Prześlij zdjęcie

Wyodrębnij paletę kolorów

Palette glossary

Najczęściej zadawane pytania

Powiązane narzędzia

Compress image

Convert PNG to AVIF

View EXIF metadata

Cytujesz lub udostępniasz?