Gineadóir Grádáin

Tóg grádán líneach, gathach, nó cónach, cuir stadanna datha leis agus socraigh an treo, ansin cóipeáil an CSS le cliceáil amháin.

Cineál grádáin
Stadanna datha
CSS
Coigeartaigh na stadanna agus an treo chun do ghrádán a mhúnlú.

Déantar gach grádán a rindreáil go díreach i do bhrabhsálaí. Ní uaslódáiltear aon rud a shocraíonn tú anseo chuig BroBroGo.

Ceisteanna Coitianta

Cad é an difríocht idir grádáin línigh, gathacha agus chónacha?

Cumascann grádán líneach dathanna feadh líne dhíreach a díríonn tú le huillinn. Scaipeann grádán gathach amach iad ón lár i gciorcal nó in elips. Scuabann grádán cónach timpeall an láir iad cosúil le roth datha.

Cad is stadanna datha ann?

Is éard atá i ngach stad datha ná dath atá feistithe ag suíomh feadh an ghrádáin — 0% ag an tús, 100% ag an deireadh. Bog stad chun an áit a mbíonn buaic an datha a athrú, nó cuir tuilleadh stadanna leis le haghaidh cumasc níos saibhre. Is féidir leat suas le hocht gcinn a úsáid.

Conas a rialaím an treo?

I gcás grádáin línigh nó cónaigh, socraíonn an sleamhnán uillinne an treo — pointeálann 0° suas, pointeálann 90° ar dheis. Níl aon uillinn ag grádán gathach; roghnaigh cruth ciorcail nó elipse ina ionad sin chun an chaoi a leathnaíonn sé a athrú.

Scríofa agus athbhreithnithe ag foireann eagarthóireachta BroBroGo.Nuashonraithe is déanaí:

Bunúsacha na nGrádán CSS i nDearadh Gréasáin

Is uirlisí cumhachtacha iad grádáin CSS chun aistrithe datha línteacha, gathacha nó cónacha a chruthú le haghaidh cúlraí ar shuímh ghréasáin. Gineann an brabhsálaí an grádán go díreach ag baint úsáide as cód CSS.

Braitheann dearadh grádáin ar an gcineál grádáin a roghnaítear, ar an treo nó ar an gcruth, agus ar shocrú na stadanna datha. Cibé acu an bhfuil gá le coigeartú simplí ar dhá dhath agus treo amháin, nó le struchtúr níos casta ina bhfuil cineálacha, suíomhanna agus stadanna datha iolracha, soláthraíonn an uirlis seo an cód riachtanach láithreach.

Cineálacha Grádán agus a nTreoracha

Tacaíonn an uirlis le trí chineál grádáin atá ar fáil faoin rogha Cineál grádáin:

  • Líneach: Cumascann grádán líneach dathanna feadh líne dhíreach. Is í an uillinn a shocraíonn treo an chumaisc seo.
  • Gathach: Scaipeann grádán gathach dathanna amach ón lár i gcruth ciorcail nó elipse.
  • Cónach: Scuabann grádán cónach dathanna timpeall an láir cosúil le roth datha.

Rialú an Treo agus an Chruth

Nuair a roghnaítear Líneach nó Cónach, úsáidtear an sleamhnán Uillinn chun treo an ghrádáin a shocrú. Leanann an uillinn seo rialacha geoiméadracha an bhrabhsálaí:

  • Pointeálann 0° suas.
  • Pointeálann 90° ar dheis.

Ní úsáideann grádáin ghathacha uillinn. Ina ionad sin, faoin rannán Cruth, is féidir ceann den dá rogha seo a roghnú chun an chaoi a leathnaíonn an grádán a rialú:

  • Elips
  • Ciorcal

Ról na Stadanna Datha i nDearadh Grádán

Is éard atá i ngach stad datha ná dath ar leith atá feistithe ag suíomh sonrach feadh an ghrádáin. Is é 0% tús an ghrádáin agus is é 100% an deireadh.

Tosaíonn an uirlis le dhá stad datha réamhshocraithe chun grádán tosaigh a thaispeáint:

  • #6366f1 ag suíomh 0%
  • #ec4899 ag suíomh 100%

Is féidir leat an grádán a leathnú trí chliceáil ar an gcnaipe Cuir stad leis. Nuair a chuirtear stad datha nua leis, socraítear a shuíomh réamhshocraithe ag 50%. Is féidir suas le hocht gcinn de stadanna datha a úsáid ar an iomlán. Nuair a bhíonn ocht gcinn de stadanna datha gníomhach, díchonasaítear an cnaipe Cuir stad leis chun teorainn na huirlise a chur i bhfeidhm. Más gá stad a bhaint, is féidir an cnaipe Bain stad a úsáid.

Próiseáil Sonraí agus Príobháideacht

Déantar gach grádán a rindreáil go díreach i do bhrabhsálaí. Ní uaslódáiltear aon rud a shocraíonn tú anseo chuig BroBroGo.

Conas an Gineadóir Grádáin a Úsáid go hÉifeachtach

Chun an grádán atá uait a chruthú agus an cód CSS a fháil, lean na céimeanna seo:

  1. Roghnaigh an Cineál: Roghnaigh idir Líneach, Gathach, nó Cónach faoin rannán Cineál grádáin.
  2. Socraigh an Treo nó an Cruth:
    • Má roghnaigh tú grádán líneach nó cónach, coigeartaigh an sleamhnán Uillinn (mar shampla, 0° le haghaidh treo ingearach suas, nó 90° le haghaidh treo cothrománach ar dheis).
    • Má roghnaigh tú grádán gathach, roghnaigh Elips nó Ciorcal faoin rannán Cruth.
  3. Coigeartaigh na Stadanna Datha:
    • Athraigh dath gach stid faoi Dath an stad.
    • Sleamhnaigh nó clóscríobh an Suíomh mar chéatadán idir 0% agus 100%.
    • Úsáid Cuir stad leis chun dathanna breise a chur isteach (suas le 8 gcinn ar a mhéad) nó Bain stad chun iad a laghdú.
  4. Cóipeáil an Cód: Féach ar an réamhamharc beo ar an scáileán. Nuair a bheidh tú sásta leis an toradh, cliceáil ar an gcnaipe faoin rannán CSS chun an cód ginte a chóipeáil. Athróidh staid an chnaipe chun a thaispeáint go bhfuil an cód cóipeáilte chun a dheimhniú go bhfuil sé ar do ghearrthaisce.

Ceisteanna Coitianta

Cad é an difríocht idir grádáin línigh, gathacha agus chónacha?

Cumascann grádán líneach dathanna feadh líne dhíreach a díríonn tú le huillinn. Scaipeann grádán gathach iad ón lár i gciorcal nó in elips. Scuabann grádán cónach timpeall an láir iad cosúil le roth datha.

Cad is stadanna datha ann?

Is éard atá i ngach stad datha ná dath atá feistithe ag suíomh feadh an ghrádáin — 0% ag an tús, 100% ag an deireadh. Bog stad chun an áit a mbíonn buaic an datha a athrú, nó cuir tuilleadh stadanna leis le haghaidh cumasc níos saibhre. Is féidir leat suas le hocht gcinn a úsáid.

Conas a rialaím an treo?

I gcás grádáin línigh nó cónaigh, socraíonn an sleamhnán uillinne an treo — pointeálann 0° suas, pointeálann 90° ar dheis. Níl aon uillinn ag grádán gathach; roghnaigh cruth ciorcail nó elipse ina ionad sin chun an chaoi a leathnaíonn sé a athrú.

An uaslódáiltear mo chuid dearaí chuig freastalaí seachtrach?

Ní uaslódáiltear. Déantar gach grádán a rindreáil go díreach i do bhrabhsálaí, agus ní sheoltar aon rud a shocraíonn tú san uirlis chuig BroBroGo.

Gineadóir CSS Cubic BezierTarraing an dá láimhseáil chun cuar maolaithe a mhúnlú, féach ar phonc ag gluaiseacht air i gcomparáid le ceann seasta, agus cóipeáil an luach cubic-bezier().Gineadóir Box ShadowTarraing sleamhnáin chun box-shadow a mhúnlú, cruachaigh cisealacha le haghaidh doimhneachta, agus cóipeáil an CSS críochnaithe láithreach.Gineadóir Border RadiusCruinnigh gach cúinne le sleamhnáin, cruthaigh cruthanna orgánacha leis an modh elipseach, agus cóipeáil an CSS láithreach.Gineadóir FlexboxSocraigh coimeádán flex agus a mhíreanna le rialtáin radhairc, féach ar an leagan amach ag freagairt beo, agus cóipeáil an CSS le cliceáil amháin.Gineadóir CSS GridSocraigh do cholúin agus do rónta, tarraing trasna na gcealla chun míreanna a chur, agus cóipeáil an CSS greille le HTML meaitseála le cliceáil amháin.Áireamhán CSS clamp()Iontráil méid le haghaidh scáileáin bheaga agus mhóra agus faigh luach sreabhach clamp() a scálaíonn go réidh eatarthu — le haghaidh clómhéideanna, padding, corrlaigh nó bearnaí.Tiontaire DathaTiontaigh dathanna idir HEX, RGB, HSL, HSV, CMYK agus LAB — cuir réimse ar bith in eagar agus nuashonrófar an chuid eile de réir mar a théann tú ar aghaidh.Snaidhmtheoir & Mionlaghdaitheoir CSSAthfhleascaigh CSS praiseachúil chun é a léamh, nó mionlaghdaigh é chun é a sheoladh — le mód sábháilte nach n-athraíonn ord do rialacha riamh.Seiceálaí CodarsnachtaIontráil dath téacs agus cúlra chun cóimheas codarsnachta WCAG a fheiceáil agus cé na leibhéil AA agus AAA a n-éiríonn leo.