Bedste fri CSS Gradient Generator
Byg lineære og radiale CSS gradienter med en live preview! kopiere baggrundskoden.
100% fri
Ingen tilmelding
Ingen vandmærke
Filer behandlet i hukommelsen, aldrig gemt
✨
Go Pro for de bedste AI modeller! billede, video og chat ! plus større uploads, prioritet i køen og ingen ventetid.
Opgradering til Pro
Kærlighed best.free? Del det
Hvordan fungerer det?
- Vælg en type. Vælg lineær eller radial, og indstille vinklen for en lineær gradient.
- Vælg farver og stop. Sæt to eller flere farver og deres positioner; tilføj et tredje stop i avancerede indstillinger.
- Kopiér CSS. Hit Copy CSS og indsætte baggrundsgradienten i dit stylesheet.
Om dette værktøj
Byg en CSS- gradient med øje i stedet for redigeringsværdier blind. Skift mellem lineær og radial, træk vinklen for en lineær gradient, og vælg farver og positioner for mindst to stop mens en preview-linjeopdateringer i fuld bredde live. Kopier den resulterende baggrundsegenskab direkte ind i dit stilark. De avancerede indstillinger tilføjer et tredje farvestop for rigere blandinger og lader dig vælge en cirkel eller ellipseform til radiale gradienter. Det hele kører i din browser.
Hvad folk bruger det til
- Design en helt eller sektion baggrund gradient
- Opret en knap eller kortgradientudfyld
- Blend to eller tre mærkefarver glat
- Generer en radial spotlight eller vignette effekt
Ofte stillede spørgsmål
En lineær gradient blander sig langs en lige linje i den vinkel, du vælger; en radial gradient blander udad fra et midtpunkt som en cirkel eller ellipse.
For en lineær gradient vinklen indstiller retningen af blandingen ~ 0° går nederst til toppen, 90° venstre mod højre, og så videre.
Hvert stop er en farve placeret i procent langs gradienten. Flytning et stop ændrer hvor farven sidder og hvor skarp blandingen er.
Ja. Åbn avancerede muligheder for at tilføje et tredje farvestop, indsat mellem første og sidste for en flerfarve blanding.
Nej. Farverne og stop bliver til en CSS-streng lokalt i din browser.
Helt gratis, ingen konto og ingen grænser • et klient-side værktøj med intet at måle.
Ja. Det kører i din browser, så CSS Gradient Generator virker på telefoner og tabletter samt skrivebord! Der er ingen app til at installere.
Normalt kun et par sekunder for en typisk fil! CSS Gradient Generator begynder at arbejde det øjeblik, du giver det dit input.
Tilfældig brug er ubegrænset, under en generøs fair-use cap, der holder det hurtigt for alle.
Alle moderne browsere! Chrome, Safari, Firefox og Edge. CSS Gradient Generator har brug for intet installeret ud over den browser, du allerede bruger.