✨ Gradientgenerator
background: linear-gradient(to right, #ff6b6b, #6bc1ff);
Skapa fantastiska linjära och radiella CSS-gradienter med vårt användarvänliga gradientverktyg. Välj färger, riktningar och kopiera CSS-koden direkt för dina webbprojekt.
Extrahera färger från vilken bild som helst online gratis. Ladda upp en bild, klicka för att välja färger och få HEX, RGB, HSL och CMYK-värden. Skapa och exportera färgpaletter.
Kontrollera färgkontrastförhållanden för webbtillgänglighet. Testa kombinationer av text- och bakgrundsfärger mot WCAG-riktlinjerna med förhandsgranskning i realtid, tillgänglighetsbetyg och förbättringsförslag.
Skapa fantastiska visuella collage genom att kombinera dina bilder med extraherade färgpaletter. Ladda upp vilken bild som helst för att automatiskt extrahera dess dominerande färger och skapa vackra kompositioner med anpassningsbara layouter, stilar och bildförhållanden.
Skapa, visa och hantera färgpaletter med avancerade funktioner. Generera paletter med hjälp av färgteori, importera från olika format, kontrollera tillgänglighetskontrast och exportera till CSS, SCSS, Tailwind, JSON eller PNG-format.
Generera fantastiska färgpallatter online med vår gratis färgpallattsgenerator. Skapa harmoniska färgscheman med hjälp av färgteoriprinciper eller extrahera färger från bilder. Exportera till formaten CSS, SCSS, Tailwind, JSON, PDF och PNG.
Konvertera hex-färger till närmaste Pantone-matchningar med vårt gratis onlineverktyg. Har noggrann Delta E färganpassning, bläddra bland över 40 populära Pantone-färger och få omedelbara färgjämförelser. Perfekt för designers, tryckare och färgproffs.
Välj dina första och andra färger med hjälp av färgväljarna eller ange hex-färgkoder direkt i textfälten.
Välj mellan linjär gradient för riktade färgövergångar eller radiell gradient för cirkulära färgövergångar från mitten och utåt.
För linjära gradienter, välj mellan 8 riktningsalternativ inklusive höger, vänster, upp, ner och diagonala riktningar med hjälp av pilknapparna.
Klicka på 'Kopiera CSS'-knappen för att kopiera hela CSS-bakgrundsegenskapen till ditt urklipp, redo att klistras in i dina stilmallar.
Skapa både linjära och radiella gradienter med full kontroll över färgval och gradientriktning. Växla mellan gradienttyper direkt.
Välj mellan 8 olika riktningar för linjära gradienter, inklusive horisontella, vertikala och diagonala orienteringar med intuitiva pilkontroller.
Generera slumpmässiga färgkombinationer direkt för att upptäcka nya gradientidéer och kreativa färgscheman för dina projekt.
Kopiera den genererade CSS-gradientkoden till urklipp med ett klick. Färdig att använda CSS-bakgrundsegenskap för omedelbar implementering.
En CSS-gradientgenerator är ett verktyg som skapar CSS-bakgrundsgradienter genom att kombinera två eller flera färger i mjuka övergångar. Vårt gradientverktyg genererar CSS-egenskaperna `linear-gradient` och `radial-gradient` som kan användas direkt i webbutveckling. Linjära gradienter skapar riktade färgövergångar, medan radiella gradienter skapar cirkulära övergångar från en mittpunkt. Verktyget erbjuder förhandsvisning i realtid och genererar webbläsarkompatibel CSS-kod för moderna webbstandarder.
Se dina gradientändringar direkt med ett stort förhandsgranskningsområde som visar exakt hur din gradient kommer att se ut i dina webbprojekt.
Genererad CSS-kod är optimerad och redo att användas med korrekt syntax för `background`-egenskapen, kompatibel med alla moderna webbläsare.
Lättanvända pilknappar för att ställa in gradientriktningar, vilket gör det enkelt att skapa exakt den orientering du behöver för din design.
Slumpmässig färggenerator hjälper till att upptäcka nya färgkombinationer och ger kreativ inspiration för dina gradientdesigner och färgscheman.
Linjära gradienter skapar färgövergångar i en rak linje (horisontell, vertikal eller diagonal), medan radiella gradienter skapar cirkulära färgövergångar som strålar utåt från en mittpunkt.
Ja, du kan ange vilken giltig hex-färgkod som helst direkt i textfälten bredvid färgväljarna. Verktyget accepterar 6-siffriga hex-koder som #ff6b6b eller #6bc1ff.
Kopiera CSS-koden och klistra in den i din stilmall. Den genererade koden är en komplett `background`-egenskap som du kan tillämpa på valfritt HTML-element för att visa gradienten.
Ja, den genererade CSS-koden använder standard-syntaxen för `linear-gradient` och `radial-gradient` som stöds av alla moderna webbläsare inklusive Chrome, Firefox, Safari och Edge.
För närvarande fokuserar vårt verktyg på tvåfärgade gradienter för enkelhet och ren design. Du kan modifiera den genererade CSS-koden för att lägga till fler färgstopp vid behov.