Aller au contenu principal

    Vi använder cookies

    Vi använder cookies för att förbättra din upplevelse. Genom att fortsätta surfa accepterar du deras användning.

    Läs mer i vår Cookies och Integritet

    CSS-gradient

    Generera linjära, radiala CSS-gradienter. Använd CSS-gradient gratis online utan registrering, med snabba resultat och säker bearbetning i webbläsaren.

    Preview

    background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);

    Settings

    %
    %

    CSS-gradient hjälper dig att arbeta med färger direkt i webbläsaren.

    Verktyget är byggt för designers, utvecklare och kreatörer som behöver snabba och pålitliga resultat.

    Supported formats

    CSS
    Tailwind
    SCSS
    Linear
    Radial
    Conic

    How it works

    1

    Step 1

    Öppna CSS-gradient

    2

    Step 2

    Ange eller importera färger

    3

    Step 3

    Kopiera, exportera eller återanvänd resultatet

    Vanliga misstag att undvika

    • Att glömma kontrollera kontrast kan försämra läsbarheten.
    • För många färger kan göra paletten svårare att använda.

    Proffstips

    • Spara huvudfärger som CSS-variabler.
    • Testa paletten i ljust och mörkt läge före publicering.

    Privacy guaranteed: everything is processed locally in your browser.

    När det är möjligt sker bearbetningen lokalt i webbläsaren. Inget konto krävs.

    CSS-gradient för dina färgprojekt

    Generera linjära, radiala CSS-gradienter.

    CSS-gradient utan precisionsförlust

    Konverteringar körs på exakta värden (HEX, RGB, HSL, OKLCH). Ingen visuell approximation — du får färgen sann mot din designavsikt.

    CSS-gradient gratis online

    Ingen registrering, ingen nedladdning. CSS-gradient är 100% gratis och fungerar i vilken webbläsare som helst. Den gratis planen inkluderar 10 användningar per dag.

    CSS-gradient snabbt och säkert

    Bearbetning sker direkt i webbläsaren för maximal hastighet. Ingen data skickas till våra servrar — dina färger förblir privata.

    CSS-gradient för delning och samarbete

    Exportera resultat som HEX, RGB, HSL, CSS, JSON eller kopiera med ett klick. Perfekt för att dela färgguide med ditt team.

    Upptäck alla våra färgverktyg

    Extrahera, konvertera, generera paletter, gradienter och WCAG-kontraster med några klick.

    Se alla verktyg

    Related tools

    Mesh-gradient
    Animerad gradient
    Glassmorfism
    Färgade skuggor

    Guider och handledningar

    Lär dig hur du använder våra verktyg med våra detaljerade guider.

    css-gradient: praktisk guide för gradients

    Lokaliserad guide för att använda css-gradient, förstå bästa praxis för gradients och undvika vanliga misstag.

    css-gradient: praktisk guide för gradients

    Lokaliserad guide för att använda css-gradient, förstå bästa praxis för gradients och undvika vanliga misstag.

    css-gradient: praktisk guide för gradients

    Lokaliserad guide för att använda css-gradient, förstå bästa praxis för gradients och undvika vanliga misstag.

    Frequently asked questions

    Ja, verktyget finns gratis online.

    När det är möjligt sker bearbetningen i webbläsaren för att skydda dina data.