CSS gradientų generatorius

Sukurkite linijinius, radialines ir konjines CSS gradientus savo naršyklėje.

Spalvų sustojimas

Naudokite sustojimo rankas arba klaviatūros juostus, kad išreikštumėte pozicijas. Kiekviena sustojimas apima aiškią spalvą, nešvarumą ir procentinę dalį.

Paruošta nuskaityti

Interneto naršyklės vietinis apdorojimas

Jūsų gradientas lieka šiame naršyklėje. jokių spalvų ar generuotų CSS siunčiama į Konverterį.

Apribotas importo gramatika

Importuojamas linear gradient(), radial gradientas(), arba konic gradiento(), turinčių hex spalvų ir procentų. deklaracijos, URL, kintamieji ir nežinomos funkcijos yra atmestas vietiniu būdu.

Prieinamų atsitikimų

Gaminamas CSS apima tvirtą fonos spalvų atsigavimą kartu su gradientu nepalaikomiems rendereriams ir prieinamą kontrolės chrome.

Dažniausiai užduodami klausimai

Ar mano gradientas yra įkeltas?

Gradient statusas, spalvos, importuotas CSS ir generuotas CSS lieka jūsų naršyklėje.

Kokius CSS gradientų tipus palaiko?

Generatorius sukuria linijinį gradientą(), radialinį gradiento(), ir konikos gradientas(), kurio spalva yra kelios hex spalvos.

Ką galiu importuoti?

Importuojamas sąmoningai ribotas gramatika, naudojant vieną palaikytą gradientinę funkciją, hex spalvas, pasirinktinius procentus ir ribotus kampo ar pozicijos vertes.

Susiję kūrėjai ir dizaino įrankiai

Kūrėjų įrankiaiNaršykite naršyklės priemones CSS spalvų konverterisKonvertuoti CSS spalvas SCSS KompiliatoriusSass / SCSS Snippets internete CSS minifierKomprimuoti CSS kodą vietiniu būdu jūsų naršyklėje. Vaizdo spalva PickerRinkitės spalvas iš nuotraukų vietiniu būdu.

CSS gradientų generatorius

Sukurkite linijinius ar radialines CSS gradientus ir vaizdo spalvos sustojimus, kampą, poziciją ir kartojimą.

Įvestis
Gradientų tipas, spalvų sustojimai, pozicijos, kampas ir pakartotinis nustatymas.
Išvestis
Gyvojo vaizdo ir kopijuojamo CSS fone deklaracija.
Svarbūs apribojimai
naršyklės atrankos gali šiek tiek skirtis variklio, ir įrankis nevertina kontrasto ar garantuoja paramą paveldimų naršyklėse.
Privatumas ir duomenų tvarkymas
gradientų tipas, spalvų sustojimai, pozicijos, kampas ir pakartotinės nustatymai yra apdorojami šioje naršyklės skirtuke. konverteris nepriima ar saugoma; uždarant arba perkelti puslapį išvalomas darbo būklė, nebent įrankis aiškiai siūlo vietinį atsisiuntimą.

Kaip naudoti šį įrankį

  1. Teikti gradientų tipą, spalvų sustojimus, pozicijas, kampus ir pakartotinai nustatymus įrankio kontrolės.
  2. Pasirinkite nustatymus, kurie paveikia tiesioginį vaizdo įrašą ir kopijuojamą CSS fonos deklaraciją, tada paleiskite įrankį.
  3. Peržiūrėkite gyvo peržiūros ir kopijuojamą CSS fonos deklaraciją prieš kopijuodami arba atsisiųskdami.

Dažnos nesėkmių priežastys

Trūkstamas spalvų sustojimas, neigiamas spalvas ar nesuderinama padėtis neleidžia sukurti galiojančios CSS deklaracijos.

Praktinis pavyzdys

Sukurkite 90 laipsnių linijinį gradientą nuo 0 % iki 100 % nuo #111827 iki #f59e0b ir kopijuokite deklaraciją.