Hur skapar jag en färgpalett från en bild?

Ladda upp, dra in eller klistra in en bild. Verktyget grupperar de synliga dominerande färgerna till en palett med 3, 5 eller 8 färger.

Vad är en bildpalettsextraktor?

Det är ett verktyg som sammanfattar de dominerande synliga färgerna i en hel bild som en mindre, representativ färgpalett.

Kan jag kopiera HEX, RGB eller CSS-variabler?

Ja. Kopiera varje HEX- eller RGB-värde separat, alla HEX-värden rad för rad eller hela paletten som CSS-variabler.

Laddas min bild upp eller sparas den?

Nej. Bilden avkodas och analyseras lokalt i webbläsaren och skickas inte till en server.

Varför blev paletten mindre än jag valde?

Bilden kan ha färre unika synliga färger än den valda storleken. Verktyget duplicerar inte färger och ignorerar effektivt genomskinliga pixlar.

Skapa en färgpalett från en bild

Ladda upp, dra in eller klistra in ett foto, en skärmbild, en logotyp eller en illustration för att skapa en färgpalett från hela bilden. Verktyget sammanfattar de dominerande synliga färgerna i en palett med 3, 5 eller 8 färger, i stället för att läsa av en enda pixel. Kopiera enskilda HEX- och RGB-värden, alla HEX-värden rad för rad eller en färdig uppsättning CSS-variabler. Bilden behandlas lokalt i webbläsaren och laddas aldrig upp till ColourPicker.app.

Ladda upp en bild

Välj en fil, dra den hit eller klistra in en bild från urklipp.

Du kan också klistra in en skärmbild med Ctrl+V eller Kommando+V.

Din bild stannar på din enhet och behandlas bara i den här webbläsaren.

Fler verktyg

Picker

Färgväljare

Ladda upp en bild och klicka för att extrahera HEX-, RGB- och HSL-färgkoder.

HEXRGBHSLImage

Converter

Färgkonverterare

Konvertera färger mellan HEX, RGB och HSL direkt.

HEXRGBHSL

Checker

Kontrastkontroll

Kontrollera färgkontrastförhållanden mot WCAG AA- och AAA-standarder.

WCAGAAAAA

Generator

Palettgenerator

Generera harmoniska färgpaletter från valfri grundfärg.

HarmonyHSLHEX

Så hämtar du en färgpalett från en bild

Välj en bildfil, dra den till uppladdningsytan eller klistra in en bild från urklipp. Webbläsaren avkodar bilden och analyserar ett mindre prov av de synliga pixlarna. Närliggande nyanser grupperas så att resultatet visar de färger som har störst visuell betydelse i bilden, inte varje enskilt pixelvärde.

Lägg till ett foto, en logotyp, en illustration, en skärmbild eller en annan bild som webbläsaren kan öppna.
Efter inläsningen skapas automatiskt en palett med fem dominerande färger.
Välj 3, 5 eller 8 färger för en kortare eller mer detaljerad färgreferens.
Kopiera enstaka färger eller exportera hela paletten till nästa design- eller utvecklingssteg.

Ett fotografi kan ge både ljusa, mörka och stora bakgrundstoner, medan en enkel ikon ibland bara har två eller tre synliga färger. Paletten beskriver det som faktiskt finns i bilden utan att fylla ut resultatet med påhittade variationer.

Dominerande färger, inte en exakt pixel

Den här sidan är till för en flerfärgad sammanfattning av ett foto, en illustration, en logotyp eller en skärmbild. Du får de färger som präglar bilden som helhet, inte det exakta värdet i en bestämd bildpunkt.

Om du behöver värdet från en enda pixel använder du välj en exakt färg från en bild. För komplementära, analoga eller andra teoretiska relationer från en basfärg kan du skapa en färgharmoni från en basfärg. Den här extraktorn skapar inga harmonier utan sammanfattar redan synliga färger.

Kopiera paletten som HEX, RGB eller CSS-variabler

Varje färgruta har ett HEX-värde och ett RGB-värde med egna kopieringsknappar. Du kan också kopiera alla HEX-värden som en lista med en färg per rad. Det passar bra för anteckningar, visuella referenser och moodboards.

Knappen för CSS-variabler ger ett :root-block med namn som --cp-1, --cp-2 och --cp-3. Använd det som en snabb start i en prototyp eller stilfil och kontrollera sedan kontrast och tillgänglighet i den slutliga designen.

Din bild stannar privat

All bearbetning sker i din webbläsare. Bilden skickas inte till ColourPicker.app eller en extern bildtjänst och sparas inte på en server. En lokal förhandsvisning finns bara tillfälligt och släpps när du byter bild eller lämnar sidan.

Analysen använder synlig färginformation. Effektivt genomskinliga pixlar ignoreras, så en transparent bakgrund i exempelvis en PNG-logotyp inte felaktigt blir en dominerande färg.

Varför en bild kan ge färre färger

Valet 3, 5 eller 8 anger ett tak, inte ett löfte om att skapa extra färgrutor. En enkel symbol, platt grafik, tvåfärgad logotyp eller nästan helt transparent bild kan ha färre unika synliga färger än den begärda storleken.

I det läget visas den mindre, verkliga paletten. Verktyget duplicerar inte färger och hittar inte på ytterligare nyanser bara för att nå ett visst antal.

Vanliga frågor

Hur skapar jag en färgpalett från en bild?: Ladda upp, dra in eller klistra in en bild. Verktyget grupperar de synliga dominerande färgerna till en palett med 3, 5 eller 8 färger.
Vad är en bildpalettsextraktor?: Det är ett verktyg som sammanfattar de dominerande synliga färgerna i en hel bild som en mindre, representativ färgpalett.
Kan jag kopiera HEX, RGB eller CSS-variabler?: Ja. Kopiera varje HEX- eller RGB-värde separat, alla HEX-värden rad för rad eller hela paletten som CSS-variabler.
Laddas min bild upp eller sparas den?: Nej. Bilden avkodas och analyseras lokalt i webbläsaren och skickas inte till en server.
Varför blev paletten mindre än jag valde?: Bilden kan ha färre unika synliga färger än den valda storleken. Verktyget duplicerar inte färger och ignorerar effektivt genomskinliga pixlar.