CSS-gradientgenerator
색상 정지점
0%
100%
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); Senast uppdaterad: 2026 · Gratis onlineverktyg
Vad är CSS-gradientgenerator?
Gratis visuell onlineredigerare för att skapa CSS-gradienter och kopiera koden
Så använder du
- 1 Välj typ — Välj gradienttyp (linjär, radiell, konisk).
- 2 Justera färgstopp — Justera färg och position för varje färgstopp.
- 3 Förhandsgranska — Kontrollera resultatet i realtid i förhandsgranskningen.
- 4 Kopiera CSS-kod — Kopiera CSS-koden till urklipp med knappen 'Kopiera'.
Relaterade verktyg
CSS box-shadow-generator Gratis visuell onlineredigerare för att skapa CSS box-shadow och kopiera koden
CSS border-radius-generator Gratis online CSS border-radius-redigerare med 8 handtagskontroller
Färgkodskonverterare Gratis onlineverktyg för att konvertera mellan HEX, RGB, HSL, OKLCH färgkoder med WCAG-kontrastberäkning
Vanliga frågor
Det finns ingen gräns, men 2–6 är typiskt. För många kan påverka prestandan.
Ja. Aktivera kryssrutan 'Upprepa' för att lägga till repeating-prefixet.
Fem förinställningar erbjuds: Sunset, Ocean, Forest, Midnight och Rainbow.
För närvarande produceras bara ren CSS. Tailwind-konvertering planeras för en framtida uppdatering.
Nej. All bearbetning sker i webbläsaren.