Paras vapaa CSS Gradienttigeneraattori
Muodosta suoralla esikatselulla suoraviivaiset ja radiaaliset CSS-gradientit - kopioi taustakoodi.
100 % ilmaiseksi
Ei ilmoittautumista
Ei vesileimaa
✨
Go Pron parhaat tekoälymallit - kuva, video ja keskustelu - sekä isommat lataukset, jonossa etusijalle asetettu ja jonottamaton.
Päivitä pro
Rakkaus Best.Free? Jaa se
Miten se toimii?
- Valitse tyyppi. Valitse lineaarinen tai sädemäinen ja aseta kulma lineaariselle kaltevuudelle.
- Valitse värit ja pysähdykset. Aseta kaksi tai useampi väri ja niiden sijainti; lisää kolmas pysähdys Advanced vaihtoehtoja.
- Kopioi CSS. Paina Kopioi CSS ja liitä taustaliukumäki tyylilistaan.
Tästä työkalusta
Rakenna CSS-gradientti silmämääräisesti sen sijaan, että olisit muokannut arvoja sokeaksi. Vaihda lineaari- ja radiaalin välillä, vedä kulmaa kohti lineaarista kaltevuutta ja valitse värit ja asennot vähintään kahdeksi pysähdykseksi, kun täyskaistainen esikatselupalkki päivittyy suorana lähetyksenä. Kopioi tuloksena oleva taustaominaisuus suoraan tyylilistaan. Advanced-valinnoilla lisätään kolmas väripiste rikkaammille sekoituksille ja annetaan valita ympyrän tai ellipsimuodon värien gradienteille. Kaikki kulkee selaimessasi.
Mihin ihmiset käyttävät sitä
- Suunnittele sankari tai lohkon taustaliukumäki
- Luo painiketta tai korttien kaltevuustäyte
- Yhdistä kaksi tai kolme brändiväriä tasaiseksi
- Luo raidallinen valokeila- tai vinjettiefekti
Usein kysyttyjä kysymyksiä
Lineaarinen kaltevuus sekoittuu suoran viivan suuntaisesti valitsemaasi kulmaan; radiaalinen kaltevuus sekoittuu ulospäin keskikohdasta ympyränä tai ellipsinä.
Lineaarisen kaltevuuden kulma määrittää sekoituksen suunnan - 0° menee ala-yläkulmaan, 90° vasemmalta oikealle ja niin edelleen.
Jokainen pysäkki on väri, joka on sijoitettu prosenttiosumalla kaltevuutta pitkin. Stop muuttaa sen paikkaa ja terävyyttä.
Kyllä. Avaa lisäasetukset kolmannen väripysäkin lisäämiseksi, ensimmäisen ja viimeisen väliin monivärisekoitukselle.
Ei, värit ja pysäkit muutetaan CSS-jousiksi paikallisesti selaimessasi.
Täysin ilmainen, ei tiliä eikä rajoja - asiakaspuolen työkalu, jolla ei ole mitään mitattavaa.
Kyllä. Se toimii selaimessasi, joten CSS Gradient Generator toimii puhelimissa ja tableteissa sekä työpöydällä - ei ole mitään sovellusta, jonka asentaa.
Yleensä vain muutama sekunti tyypilliseen tiedostoon - CSS Gradient Generator alkaa toimia heti, kun annat sille syötettä.
Casual-käyttö on rajatonta, reilun käytön anteliaan suojakorkin alla, joka pitää sen nopeana kaikille.
Kaikki modernit selaimet - Chrome, Safari, Firefox ja Edge. CSS Gradient Generator ei tarvitse mitään selaimen lisäksi, jota jo käytät.