Kizalishaji Gradient CSS

Tengeneza CSS gradients kwa njia ya kuona. Gradient ni mpito wa rangi; ongeza vituo vya rangi, badilisha angle na nakili msimbo wa CSS.

Linear na radialVituo vingiNakili CSS
Muonekano
Kuhusu CSS gradients

Jinsi ya kutumia CSS Gradients

CSS gradients huonyesha mpito laini kati ya rangi mbili au zaidi. Browser huzichora kama CSS, si picha, kwa hiyo hubaki sharp kwenye ukubwa tofauti na hupakia haraka. Aina kuu ni linear-gradient kwa mpito wa mstari na radial-gradient kwa mpito unaotoka katikati.

Jinsi ya kutumia zana hii

  1. Chagua aina ya gradient: linear au radial
  2. Kwa linear, badilisha angle kwa slider
  3. Chagua rangi kwa vichagua-rangi na weka asilimia za nafasi
  4. Ongeza vituo vya rangi kwa kitufe cha "+ Ongeza"
  5. Nakili msimbo wa CSS uliotengenezwa kwa mbofyo mmoja

Gradients are widely supported across all modern browsers. For reference, see the Nyaraka za MDN kuhusu CSS gradient.

Kwa zana nyingine za developer, angalia Kikokotoo rangi na Kijaribu Regex.

Kizalishaji Gradient CSS kwa Kiswahili. Jenga gradients za CSS kwa UI, landing pages na cards. Hakiki contrast na accessibility kabla ya kutumia kwenye text. Kwa security, API, hosting, SEO, PWA, USSD au maamuzi ya domain, hakiki output, docs za provider na mazingira ya production kabla ya launch.

Kizalishaji Gradient CSS hukusaidia kutengeneza linear na radial gradients kwa interface ya kuona na kunakili CSS code kwa haraka. Ongeza hadi vituo nane vya rangi, rekebisha angle na nafasi, kisha uone gradient papo hapo. Zana hutengeneza CSS safi inayofanya kazi kwenye browsers za kisasa bila vendor prefixes nyingi. Iwe unatengeneza hero section, button, background ya card au decoration, zana hii hupunguza kuandika syntax ya gradient kwa mkono. Developer wa front-end, designer wa UI na yeyote anayejenga interface za web wanaweza kuitumia kuongeza kina na mvuto wa kuona haraka.

Maswali ya mara kwa mara

Ni aina gani za CSS gradients zinatumika?
Inasaidia linear gradient yenye angle inayobadilika na radial gradient ya circle au ellipse, pamoja na hadi vituo 8 vya rangi.
Naweza kutumia CSS inayotengenezwa kwenye mradi wowote?
Ndiyo. Ni CSS ya kawaida inayofanya kazi kwenye browsers za kisasa. Kwa matumizi mengi huhitaji vendor prefixes.
Ninaongezaje vituo zaidi vya rangi?
Bofya "+ Ongeza kituo cha rangi" kuongeza hadi rangi 8. Kila moja ina kichagua-rangi na udhibiti wa nafasi.