En färggradient är en gradvis blandning mellan två eller flera färger. Vanligtvis definieras en lutning av två användardefinierade färger, och datorn beräknar automatiskt alla färger däremellan. Färggradienter kan bestå av två eller flera använda-definierade färger. I CSS-kod för webbplatser kan du definiera linjära och radiella gradienter. En linjär färggradient blandar färger i en rak linje och resulterar i en progressiv färgövergång från en punkt till en annan. En radiell färggradient blandar färger på ett cirkulärt sätt och resulterar i en färgövergång som strålar från en viss punkt.
Normalt väljer en designer två eller flera färger för att göra en färggradient. Detta kräver designupplevelse och ett bra öga för färgharmoni. Vår färggradientgenerator använder färggradientalgoritmerna hos vår logotyptillverkare My Brand New Logo, vilket automatiskt skapar snygga och välbalanserade färggradienter. Du måste bara välja en enda färg, och vår gradientgenerator genererar automatiskt en snygg gradient utifrån den. Det finns mycket färgvetenskap som händer bakom kulisserna, men vara säker på att din färggradient alltid ser bra ut.
Vår CSS-bakgrundsgradientgenerator skapar automatiskt en färggradient baserad på din valda färg. Vi har olika stilar av lutningar. Ljusstil genererar en färggradient som ser ut som om den markeras av en ljuskälla. Perfekt för att lägga till lite glans i dina färger. Den djupa stilen tar det konceptet lite längre och lägger till fler nyanser i färgspektrumet. Regnbågens stil är perfekt för ljusare färger för att skapa en pärlemors look. Och intensiv stil skapar en intensiv, djup och rik färggradient.
När du har valt en färg kan du dra reglagen för att justera lutningen. Den första reglaget styr graden av gradient. Den andra skjutreglaget kontrollerar rotationsgraden på färggradienten. Du kan använda detta för att simulera var ljuset kommer från. Den tredje skjutreglaget växlar från linjärt till radiellt läge.
Om du är nöjd med din lutning får du din CSS-kod genom att kopiera den genererade CSS-färggradientkoden. Placera den i din egen CSS-kod för att få exakt samma lutning i din egen webbdesign.
Om du vill skapa en logotyp med en färggradient har vi skapat några riktlinjer för dig:
Använd denna CSS-kod i ditt webbprojekt för att få din färggradient: