Enamik gradienditööriistu annab sulle vaid rea CSS-koodi. See tööriist joonistab gradiendi päris lõuendile (canvas) ja lubab sul alla laadida valmis PNG-pildi täpselt sellises pikslisuuruses, nagu vaja - telefoni taustapilt, 1920x1080 arvuti taustapilt, ruudukujuline sotsiaalmeedia postitus või kohandatud mõõt. Midagi ei laadita üles: pilt joonistatakse ja salvestatakse täielikult sinu seadmes, seega jäävad su värvid ja failid privaatseks.
Tasuta Gradiendi Generaator
Töötab täielikult sinu brauseris - midagi ei laadita üles, kontot pole vaja.
Tüüp
Pildi suurus
px
Värvi peatuspunktid
Salvestab päris PNG suuruses 1920×1080 px
Mis on gradiendi generaator?
Gradiendi generaator on tööriist, mis sulatab kaks või enam värvi sujuvaks üleminekuks ja eksportib selle allalaaditava pildina. Vali värvid ja peatuspunktid, otsusta, kas lineaarne või radiaalne, määra suurus ning salvesta PNG taustapildi, taustapinna, bänneri või pisipildina. Kõik toimib otse sinu brauseris.
Kuidas kasutada
- 1Vali lineaarne või radiaalne. Lineaarne gradient sulatab värvid kokku sirgjoone ulatuses sinu määratud nurga all; radiaalne levitab need keskpunktist väljapoole ringikujuliselt.
- 2Määra värvid ja peatuspunktid. Klõpsa värvinäidisel, et see valida, ja lohista liugurit, et peatuspunkti liigutada. Lisa kuni 8 peatuspunkti või eemalda kuni 2-ni, kiire idee saamiseks vajuta Juhuslik.
- 3Vali pildi suurus. Puuduta eelseadistust (arvuti, telefon, ruut, sotsiaalmeedia) või sisesta kohandatud laius ja kõrgus pikslites. Eelvaade uueneb reaalajas.
- 4Laadi PNG alla. Klõpsa Laadi PNG alla, et salvestada gradient pildina täisresolutsioonis, või kopeeri CSS-kood, et sama gradienti koodis uuesti kasutada.
Kellele see sobib
- Disainerid ja sisuloojad, kes vajavad puhast gradiendiga taustapilti slaidile, pisipildile, bännerile või loole ilma Photoshopi avamata.
- Telefoni- ja arvutikasutajad, kes loovad kohandatud gradienditaustapilti täpselt oma ekraani eraldusvõimes.
- Arendajad, kes soovivad kerget gradiendi PNG-d kohahoidjana või peapildina, koos vastava CSS-koodiga, et sama gradient koodis taasesitada.
- Sotsiaalmeedia haldajad, kes ekspordivad brändile sobivaid gradienditaustu postituste, lugude ja kaanepiltide jaoks õiges suuruses.
Korduvad küsimused
Kas see gradiendi generaator on tasuta?
Jah - 100% tasuta, ilma registreerimise, vesimärkide ja piiranguteta. Loo ja laadi alla nii palju gradiendipilte, kui soovid.
Kas midagi laaditakse serverisse üles?
Ei. Gradient joonistatakse ja salvestatakse täielikult sinu brauseris lõuendi (canvas) abil. Ühtegi värvi, pilti ega kasutusandmet kuhugi ei saadeta.
Millises pildiformaadis see eksporditakse?
See eksporditakse PNG-na, mis hoiab gradiendi täiesti sujuva ja kadudeta, ilma tihendusartefaktideta. Fail salvestatakse sinu määratud täispiksli suuruses, valmis kasutamiseks taustapildi, taustapinnana või üleslaadimiseks.
Millises suuruses peaksin gradienditaustapildi tegema?
Sobita see oma ekraaniga. Levinud valikud on 1920x1080 enamiku arvutite jaoks, 1080x1920 telefonile püstpaigutuses ning 1080x1080 ruudukujulisele sotsiaalmeedia postitusele. Samuti võid sisestada mis tahes kohandatud laiuse ja kõrguse kuni 8000 pikslini.
Mis vahe on lineaarsel ja radiaalsel gradiendil?
Lineaarne gradient sulatab värvid kokku sirgjoone ulatuses sinu valitud nurga all, nii et värv muutub üle kogu pildi. Radiaalne gradient algab keskpunktist ja levib väljapoole ringikujuliselt, nii et värv muutub keskelt äärte suunas.
Kas ma saan lisaks pildile ka CSS-koodi?
Jah. Koos allalaaditava PNG-ga näitab tööriist ka vastavat background-image CSS-koodi. Kopeeri see, et taasesitada täpselt sama gradient veebilehel või rakenduses, kasutamata pildifaili.
Kuidas töötavad värvi peatuspunktid?
Iga peatuspunkt seob värvi asukohaga 0%-st kuni 100%-ni piki gradienti. Üleminek toimub sujuvalt naaberpunktide vahel. Kahe peatuspunkti paigutamine samasse asukohta loob sujuva ülemineku asemel terava serva, mis on kasulik triipude või värviplokkidega taustade jaoks.