CSS gradient ģenerators

Izveidojiet lineārus, radiālus un koniskus CSS gradientus jūsu pārlūkprogrammā.

Krāsu pārtraukumi

Izmantojiet pārtraukuma rokturus vai tastatūras bultiņas, lai rediģētu pozīcijas. Katrs pārtraukums ietver skaidru krāsu, necaurredzamību un procentuālo daļu.

Gatavs

Pārlūkprogrammas vietējā apstrāde

Jūsu gradients paliek šajā pārlūkprogrammā. Nekādas krāsas vai ģenerētais CSS netiek nosūtīts uz Convertr.

Ierobežota importa gramatika

Importēšana pieņem linear-gradient(), radial-gradient() vai conic-gradient() ar hex krāsām un procentiem. Deklarācijas, URL, mainīgie un nezināmas funkcijas tiek noraidītas lokāli.

Pieejams Fallback

Ģenerētais CSS ietver vienkrāsainu fona krāsas rezerves kopā ar gradientu neatbalstītiem renderētājiem un pieejamu vadības hromu.

Biežāk uzdotie jautājumi

Vai mans gradients tiek augšupielādēts?

Nē. Gradienta stāvoklis, krāsas, importētais CSS un ģenerētais CSS paliek jūsu pārlūkprogrammā.

Kādi CSS gradient veidi tiek atbalstīti?

Ģenerators rada linear-gradient(), radial-gradient() un conic-gradient() izvadi ar vairākiem hex krāsu pārtraukumiem.

Ko var importēt?

Importēšana pieņem apzināti ierobežotu gramatiku, izmantojot vienu atbalstītu gradienta funkciju, hex krāsas, neobligātus procentus un ierobežotas leņķa vai pozīcijas vērtības.

CSS gradient ģenerators

Izveidojiet lineārus vai radiālus CSS gradientus un priekšskatiet krāsu pārtraukumus, leņķi, pozīciju un atkārtošanos.

Ievade
Gradienta veids, krāsu pieturas, pozīcijas, leņķis un atkārtošanas iestatījumi.
Izvade
Dzīva priekšskata un kopējama CSS fona deklarācija.
Reālie ierobežojumi
Pārlūkprogrammas renderēšana var nedaudz atšķirties atkarībā no dzinēja, un rīks nenovērtē kontrastu vai negarantē atbalstu mantotajās pārlūkprogrammās.
Privātums un datu apstrāde
gradienta veids, krāsu pieturas, pozīcijas, leņķis un atkārtošanas iestatījumi tiek apstrādāti šajā pārlūkprogrammas cilnē. Convertr to nesaņem un neuzglabā; lapas aizvēršana vai pārlādēšana notīra darba stāvokli, ja vien rīks skaidri nepiedāvā lokālu lejupielādi.

Kā izmantot šo rīku

  1. Nodrošiniet gradienta veidu, krāsu pārtraukumus, pozīcijas, leņķi un atkārtošanas iestatījumus rīka vadīklās.
  2. Izvēlieties iestatījumus, kas ietekmē tiešo priekšskatījumu un kopējamu CSS fona deklarāciju, tad palaidiet rīku.
  3. Pārskatiet dzīvu priekšskatījumu un kopējamu CSS fona deklarāciju pirms tā kopēšanas vai lejupielādes.

Biežākie atteices veidi

Trūkstošs krāsu pieturas punkts, nederīga krāsa vai nesaderīga pozīcija neļauj izveidot derīgu CSS deklarāciju.

Noderīgs piemērs

Izveidojiet 90 grādu lineāru gradientu no #111827 pie 0% līdz #f59e0b pie 100% un kopējiet deklarāciju.