Tresnak
Gradiente-sortzailea
Diseinatu gradiente linealak, izkinakoak eta sarezkoak, eta esportatu CSS edo irudi gisa.
Pikor-testura gehitzen du banda-efektua murrizteko. Esportatutako irudiari bakarrik aplikatzen zaio, ez CSSari.
linear-gradient(90deg, #3b82f6 0%, #8b5cf6 100%)
Tresna honi buruz
Sortzaile honekin gradiente-hondoak diseina ditzakezu webguneetarako, aurkezpenetarako, sare sozialetarako edo pantaila-hondoetarako. Hiru modu ditu: «Lineala», angelua eta kolore-geldiuneak dituen gradiente klasikoa; «Izkinak», lau kolore erpinetatik nahasten dituena; eta «Sarea», nahi duzun lekura eraman ditzakezun 4 edo 9 kolore-punturekin, gaur egungo interfazeetan hain ohikoak diren hondo leun eta organikoak lortzeko.
Aukeratu modua goiko fitxetan. «Lineala» moduan, gehitu geldiuneak «Gehitu geldiunea» botoiarekin, aldatu haien kolorea eta posizioa, berrordenatu arrastatuz eta doitu angelua biribilarekin, graduatzailearekin edo 45 graduko lasterbideekin; «Pigmentu-nahasketa» botoiak OKLab espazioan kalkulatutako tarteko koloreak gehitzen ditu. «Izkinak» eta «Sarea» moduetan, egin klik aurrebistako puntuetan kolorea aldatzeko. «Zarata» kontrolak pikorra gehitzen du bandak saihesteko.
Dena zure nabigatzailean kalkulatzen da oihal (canvas) batekin: ez da ezer igotzen eta ez duzu konturik behar. PNG bat esporta dezakezu nahi duzun tamainan edo 1K, 4K, HD edo istorio bertikaleko lasterbideekin, eta CSSa kopiatu. Kontuan izan zarata PNGari bakarrik aplikatzen zaiola, eta izkinetako eta sareko moduek ez dutela CSS baliokide zehatzik: kodea hurbilketa bat da, eta irudia da bertsio fidela.
Ohiko galderak
Nola jarri gradiente bat hondo gisa CSSn?
Kopiatu kodea «Kopiatu CSSa» botoiarekin eta erabili background edo background-image propietatearen balio gisa; adibidez: background: linear-gradient(90deg, #3b82f6 0%, #8b5cf6 100%);. Modu linealean emaitza zehatza da.
Zer da sare-gradiente bat (mesh gradient)?
Kolorea norabide bakar batean aurreratu beharrean, gainazalean banatutako hainbat puntutatik nahasten den gradientea da. Aurora-itxurako hondo leunak ematen ditu, CSSk zehatz erreproduzitu ezin dituenak; horregatik komeni da PNG gisa esportatzea.
Zergatik ikusten dira bandak edo mailak nire gradientean?
Antzeko bi kolore azalera handi batean luzatzen direnean gertatzen da, pantailak tarteko tonu nahikorik ez duelako. Igo pixka bat «Zarata» PNGa esportatu aurretik: pikorrak bandak ezkutatzen ditu.
Zer egiten du pigmentu-nahasketak?
Hiru tarteko kolore gehitzen ditu geldiune-bikote bakoitzaren artean, OKLab kolore-espazioan kalkulatuta. Horrela, kolore osagarrien arteko gradienteen erdian batzuetan agertzen den tonu grisaxka saihesten da.