Klistra in eller importera en uppsättning färger och exportera dem direkt till CSS-variabler, SCSS, Tailwind-config, JSON eller SVG-provlappar — avslutningssteget för vilken palett som helst.

Klistra in HEX-värden (ett per rad, eller separerade med kommatecken/mellanslag). rgb() och hsl() accepteras också.

Palett

Inga giltiga färger hittades — kontrollera din inmatning.

Exportformat
Exportkod

							

Allt körs i din webbläsare — klistra in en palett och kopiera produktionsklar kod i vilket format som helst. Ingen registrering, helt gratis.


Om Palettexportör

Palettexportören är det avslutande steget för vilken färgpalett som helst: klistra in en uppsättning färger och få produktionsklar kod i det format ditt projekt behöver. Den accepterar HEX-värden ett per rad eller separerade med kommatecken och mellanslag, och förstår även rgb()- och hsl()-notation.

Sex utdataformat genereras i realtid: CSS-anpassade egenskaper, SCSS-variabler, ett Tailwind-konfigurationsblock för färger, JSON, SVG-kulörer och en enkel HEX-lista. Ett konfigurerbart variabelprefix håller de genererade namnen konsekventa med din kodbas, och varje format kan kopieras till urklipp eller laddas ner som en fil.

Allt körs i din webbläsare — färgerna du klistrar in skickas aldrig någonstans. Det passar naturligt ihop med de andra palettverktygen: extrahera eller generera en palett någon annanstans, klistra in den här och gå därifrån med precis det kodutdrag som din stilmall, ditt ramverk eller din designpipeline förväntar sig.

Så använder du Palettexportör

  1. Klistra in dina färger i inmatningsfältet — HEX, rgb() eller hsl(), en per rad eller kommaseparerade.
  2. Klicka på "Uppdatera färger" för att tolka dem till en palett, eller ladda exemplet för att testa.
  3. Välj ett exportformat: CSS-variabler, SCSS, Tailwind-konfiguration, JSON, SVG-kulörer eller ren HEX.
  4. Justera variabelprefixet om du vill ha anpassad namngivning.
  5. Kopiera den genererade koden eller ladda ner den som en fil.

Vanliga frågor

HEX-värden (med eller utan #-tecknet), rgb()- och hsl()-notation känns alla igen. Du kan blanda format och separera färger med nya rader, kommatecken eller mellanslag — tolken plockar ut varje giltig färg och ignorerar resten.

Ja. Tolkning och kodgenerering sker helt i din webbläsare, så verktyget är gratis utan konto, krediter eller gräns för antal paletter eller exporter.

Klistra in dina färger, välj formatet "Tailwind-konfiguration" och kopiera det genererade blocket till färgsektionen i din Tailwind-konfiguration. Inställningen för variabelprefix styr nyckelnamnen som används för varje färg.

Nej. Färgerna stannar i din webbläsarflik — inga serveranrop görs vid tolkning eller export, och ingenting sparas när du lämnar sidan.

Det producerar en liten SVG-fil som visar varje palettfärg som en märkt kulör. Det är användbart för att bädda in en visuell paletthänvisning i dokumentation, README-filer eller design-handoff-sidor utan att behöva ta skärmdumpar.


Populära sökningar
palettexportör exportera färger till css palett till scss tailwind färgkonfig exportera palett json färgprover svg
Behöver du hjälp?
Hittade du ett problem med det här verktyget? Berätta för oss.
Rapportera ett problem

Lägg till det här gratisverktyget på din egen webbplats — kopiera och klistra in koden nedan.