Hur genererar jag en färgpalett från en varumärkesfärg?

Ange en hexkod, ett färgnamn som teal eller ett rgb()- eller hsl()-värde i fältet Basfärg och tryck på Enter. Välj sedan en typ som Varumärkespalett, Komplementär, Triadisk eller Monokromatisk och klicka på ett färgprov för att kopiera det.

Vilka exportformat stöder palettgeneratorn?

Du kan kopiera färger som hex, rgb, hsl eller oklch och exportera CSS, SCSS, JSON, Tailwind 50–950-skala, PNG, SVG, GIMP/Krita GPL, Adobe ASE eller Photoshop ACO-filer. Vilka alternativ du ser beror på exportkontrollerna.

Hur kan jag kontrollera om mina palettfärger är läsbara på vitt eller svart?

Varje färg visar märkena På vitt och På svart med WCAG-nivåer: AAA, AA, AA stor text eller Underkänd. Avsnittet Kontrollera text och bakgrund låter dig också välja en textfärg och bakgrund för att testa ett specifikt par.

Hur behåller jag vissa färger och blandar om resten?

Klicka på Lås den här färgen på de färgprov du vill behålla och tryck sedan på Blanda. Låsta färger ligger kvar och de andra ändras. Du kan också använda Redigera den här färgen för att ändra ett enskilt färgprov, vilket markerar paletten som redigerad.

Kan jag dela min palett eller välja en färg från skärmen?

”Dela resultat” skapar en länk som innehåller basfärgen, typen och alla ändringar, så att alla som öppnar den ser samma palett. På en telefon öppnas delningsvyn, på en dator kopieras länken. ”Välj från skärmen” använder webbläsarens EyeDropper, som bara finns i webbläsare som stöder den, främst Chromium-baserade.

Är det verkligen gratis?

Ja. Alla verktyg är gratis att använda, utan konto och utan kreditkort. Arbetet utförs på din enhet istället för på våra servrar, vilket är det som gör det gratis att köra.

Fungerar det på mobil?

Ja. Det fungerar i moderna mobilwebbläsare på iOS och Android, utan installation.

🎨

Gratis Färgpalettgenerator

Generera komplementära, analoga, triadiska och monokromatiska färgpaletter från valfri basfärg. Kopiera hexkoder med ett klick.

Körs i din webbläsareIngen registrering, inga popup-fönsterIngen inloggning krävsGratis för alltid

Fungerar offline när den väl lästs in

Basfärg

Skriv en hexkod, ett färgnamn som teal eller tomato, eller rgb(20, 184, 166) / hsl(174, 80%, 40%) och tryck sedan på Retur.

Varumärkespalett · 7 färger

Kopieringsformat

Exportera:Hex-etiketter på PNG/SVG

Bas

På vitt 2,5Underkänd

På svart 8,4AAA

Accent

På vitt 2,9Underkänd

På svart 7,2AAA

Ljus nyans

På vitt 1,1Underkänd

På svart 19,4AAA

Mörk nyans

På vitt 9,0AAA

På svart 2,3Underkänd

Ljus neutral

På vitt 1,1Underkänd

På svart 19,3AAA

Mellanneutral

På vitt 4,1AA stor text

På svart 5,1AA

Mörk neutral

På vitt 16,1AAA

På svart 1,3Underkänd

Kontrollera text och bakgrund

TextfärgBakgrund

Exempel på stor rubrik

Exempel på brödtext för det här paret

8,44:1Normal text AAAStor text AAA

Prova dessa

Vill du ha färger från ett foto? Använd färgextraktorn för bilder

Vanliga användningar

Generera färgpaletter för webdesignSkapa harmoniska färgscheman för webbplatser, webbappar och gränssnittskomponenter.
Skapa märkesfargepaletterUtveckla ett komplett färgsystem för märke från en enda märkesfärg — primär, sekundär, accent och neutrala.
Generera färgpaletter för konst och illustrationSkapa harmoniska färgkombinationer för digital konst, illustration och kreativa projekt.
Generera färgformat för FigmaSkapa färgpaletter för användning som Figma-färgformat och design-token-underlag.
Skapa färgpaletter för mörkt lägeGenerera ljusa och mörka varianter av din färgpalett för att bygga mörkt lägestöd.

Så här fungerar det

Verktyget är byggt utan externa bibliotek — all färgmatematik körs i handskriven JavaScript direkt i din webbläsare. Det omvandlar din valda färg mellan hex och HSL, och tillämpar sedan klassiska färgteoriregler för harmoni (komplementär, triadisk, analog, osv.) genom aritmetik på färghjulet för att skapa varje palett.

1
Hex-till-HSL-omvandling
När du väljer en färg tolkar verktyget hexsträngen till RGB-komponenter och omvandlar dem till HSL (nyans, mättnad, ljushet). Nyans är positionen 0–360 grader på färghjulet; all palettmatematik sker i denna rymd.
2
Nyansaritmetik för harmoni
Varje pallettyp är en fast rotationsformel tillämpad på basnyansen. Komplementär lägger till 180°, triadisk lägger till 120° och 240°, tetradisk stegar med 90°, delad komplementär använder 150° och 210°. Monokrom och nyanser håller nyans och mättnad konstanta samtidigt som ljushet stegas upp och ner.
3
HSL-till-hex-utdata
Varje beräknad HSL-trippel omvandlas tillbaka till en hexfärg med standardkromaformeln. Resultaten visas som en färgremsa med automatiskt kontrastanpassade etiketter (mörk text på ljusa prover, ljus text på mörka) bestämt av ett enkelt luminanströskelvärde.
4
Exportera i ditt önskade format
Paletten kan kopieras som hexsträngar eller exporteras som en CSS-variabelfil (:root { --color-1: … }), SCSS-variabler, ett Tailwind-konfigurationsutdrag, ett JSON-objekt eller en PNG-färgremsa. PNG-export använder webbläsarens Canvas-API (toDataURL) för att rita varje färgprov med dess hexetikett — allt genereras lokalt vid klick.

Relaterade verktyg

🎨

Slumpmässig färggenerator

Skapa slumpmässiga färger en i taget eller som en palett med fem, lås de du gillar, kopiera HEX-, RGB- eller HSL-värden och exportera paletten som PNG eller CSS.

Prova det

🎨

Bildfärgpalettextraherare

Extrahera de dominerande färgerna från valfri bild med k-means-färgkvantisering. Hämta hexkoder för de 2–16 vanligaste färgerna i ditt foto eller logotyp.

Prova detFiler stannar lokalt

🎨

Färgväljare och palettgenerator

Välj färger, konvertera mellan HEX/RGB/HSL och generera harmoniska paletter.