CSS-liukuvärigeneraattori
Luo lineaarisia, säteittäisiä ja kartiomaisia CSS-liukuvärejä selaimessasi.
Väripysäkit
Käytä pysäytyskahvoja tai näppäimistön nuolia sijaintien muokkaamiseen. Jokainen pysäkki sisältää selkeän värin, läpinäkyvyyden ja prosenttiosuuden.
Selaimen oma paikallinen käsittely
Liukuvärisi pysyy tässä selaimessa. Mitään värejä tai luotua CSS:ää ei lähetetä Convertrille.
Rajoitettu tuontikielioppi
Tuonti hyväksyy linear-gradient(), radial-gradient() tai conic-gradient() -funktiot heksaväreillä ja prosenttiosuuksilla. Määrittelyt, URL-osoitteet, muuttujat ja tuntemattomat funktiot hylätään paikallisesti.
Käytettävissä oleva varavaihtoehto
Luotu CSS sisältää kiinteän taustavärin varalla liukuvärin rinnalla sellaisille selaimille, jotka eivät tue sitä, sekä esteettömälle ohjauspaneelille.
Usein kysytyt kysymykset
Ladataanko liukuvärini?
Ei. Liukuvärin tila, värit, tuotu CSS ja luotu CSS pysyvät selaimessasi.
Mitä CSS-liukuvärityyppejä tuetaan?
Generaattori luo linear-gradient(), radial-gradient() ja conic-gradient() -tulosteen useilla heksaväripysäkeillä.
Mitä voin tuoda?
Tuonti hyväksyy tarkoituksella rajoitetun kieliopin, jossa käytetään yhtä tuettua liukuvärifunktiota, heksavärejä, valinnaisia prosenttiosuuksia ja rajattuja kulma- tai sijaintiarvoja.
CSS-liukuvärigeneraattori
Rakenna lineaarisia tai säteittäisiä CSS-liukuvärejä ja esikatsele väripysähdyksiä, kulmaa, sijaintia ja toistoa.
- Syöte
- Liukuvärin tyyppi, värien pysäytyspisteet, sijainnit, kulma ja toistoasetukset.
- Tulos
- Live-esikatselu ja kopioitava CSS-tausta.
- Todelliset rajoitukset
- Selaimen renderöinti voi vaihdella hieman moottorin mukaan, eikä työkalu arvioi kontrastia tai takaa tukea vanhoissa selaimissa.
- Yksityisyys ja tietojen käsittely
- liukuväri tyyppi, väripysähdykset, sijainnit, kulma ja toistoasetukset käsitellään tässä selaimen välilehdessä. Convertr ei vastaanota tai tallenna sitä; sivun sulkeminen tai uudelleenlataus tyhjentää työtilan, ellei työkalu nimenomaisesti tarjoa paikallista latausta.
Kuinka käyttää tätä työkalua
- Anna liukuvärin tyyppi, väripysähdykset, sijainnit, kulma ja toistoasetukset työkalun ohjaimissa.
- Valitse asetukset, jotka vaikuttavat live-esikatseluun ja kopioitavaan CSS-tausta-asetukseen, ja suorita sitten työkalu.
- Tarkista live-esitys ja kopioitava CSS-taustamääritys ennen kopiointia tai lataamista.
Yleiset virhetilat
Puuttuva väripysäytys, virheellinen väri tai yhteensopimaton sijainti estää kelvollisen CSS-määrityksen luomisen.
Hyödyllinen esimerkki
Luo 90 astetta lineaarinen gradientti #111827 0 %: lla #f59e0b 100 %lla ja kopioi ilmoitus.