CSS-gradienttigeneraattori
Rakenna CSS-gradientit visuaalisesti: lineaarinen, säteittäinen tai kartiomainen tyyppi, kulman liukusäädin ja jopa kuusi väripysähdystä live-täysleveällä esikatselulla ja kopioitavalla koodilla.
Tulos
Lineaarisen gradientin (135 astetta, #2193b0 0%, #6dd5ed 100%) kirjoittaminen käsin ja sivun uudelleenlataus nähdäksesi sen on hidas silmukka. Tämä generaattori sulkee sen: valitse lineaarinen, säteittäinen tai kartiomainen, vedä kulman liukusäädintä, aseta jokainen väripysäytys alkuperäisellä värivalitsimella ja prosenttipisteellä – ja täysleveä esikatselu maalataan uudelleen jokaiselle syötteelle, ja valmis taustaviiva on aina valmis kopioitavaksi.
Kolme gradienttityyppiä kattavat erilaisia töitä. Lineaariset gradientit häivyttyvät suunnan mukaan ja sisältävät useimmat sankariosat ja painikkeet; säteittäiset gradientit säteilevät keskeltä hehkua ja vinjettiä varten; kartiomaiset kaltevuudet pyyhkäisevät keskellä ja tehopiirrokset ja väripyörät. Voit vaihtaa tyyppiä milloin tahansa – pysähdyksesi jatkuvat, joten kolmen vertailu kestää sekunteja.
Jopa kuusi väripistettä antaa tilaa monikaistaisille malleille, ja esiasetetuilla sivuilla on todistettuja yhdistelmiä – lämmin auringonlasku, tyyni valtameri ja pehmeä pastellisävy – lähtökohtina, joita voit muokata tyhjien kankaiden sijaan. Huomaa työnjako: tämän sivuston väripalettigeneraattori valitsee harmoniset tasaiset värit ja värimuodon muuntaja muuntaa arvon HEX-, RGB- ja HSL-arvojen välillä, kun taas tämä työkalu tekee erilaista työtä – se muuttaa valitut värit valmiiksi CSS-gradienttikoodiksi.
Kaikki toimii paikallisesti selaimessasi: ei latausta, ei tiliä, ei palvelimen edestakaisia matkoja, ja generaattori toimii offline-tilassa latauksen jälkeen.