Kizalishaji cha Tinti na Vivuli
21 rangi
#ffffffrgb(255, 255, 255)#ebf3fergb(235, 243, 254)#d8e6fdrgb(216, 230, 253)#c4dafcrgb(196, 218, 252)#b1cdfbrgb(177, 205, 251)#9dc1fbrgb(157, 193, 251)#89b4fargb(137, 180, 250)#76a8f9rgb(118, 168, 249)#629bf8rgb(98, 155, 248)#4f8ff7rgb(79, 143, 247)#3b82f6rgb(59, 130, 246)#3575ddrgb(53, 117, 221)#2f68c5rgb(47, 104, 197)#295bacrgb(41, 91, 172)#234e94rgb(35, 78, 148)#1e417brgb(30, 65, 123)#183462rgb(24, 52, 98)#12274argb(18, 39, 74)#0c1a31rgb(12, 26, 49)#060d19rgb(6, 13, 25)#000000rgb(0, 0, 0)Maelezo ya kiufundi
Jinsi Jenereta ya Tinti na Vivuli Inavyofanya Kazi
Zana Hii Hufanya Nini
Jenereta ya Tinti na Vivuli huunda tinti nyepesi (zilizochanganywa na nyeupe) na vivuli vyeusi (vilivyochanganywa na nyeusi) kutoka kwa rangi yoyote ya msingi. Weka rangi na uchague idadi ya hatua ili kuzalisha gradieni laini ya tofauti. Kila hatua huonyesha thamani za HEX, RGB na asilimia ya kuchanganya, na kufanya iwe rahisi kujenga mizani thabiti ya rangi kwa usanifu wa UI, ujenzi wa chapa, na uwasilishaji wa data.
Matumizi ya Kawaida kwa Wasanidi
Wasanidi hutumia jenereta za tinti na vivuli wanapojenga mizani ya design tokens (mfano, blue-100 hadi blue-900), kuunda hali za hover na active kwa vipengele vya mwingiliano, kubuni ngazi za rangi zinazofikika, na kuzalisha rangi thabiti za mandharinyuma na nyuso kwa mandhari ya mwanga na giza. Zana hii ni muhimu kwa kujenga paleti maalum za rangi za Tailwind CSS au mifumo ya rangi ya Material Design.
Jinsi Tinti na Vivuli Hufanya Kazi
Tinti huundwa kwa kuchanganya rangi na nyeupe, na kuongeza mwangaza wake. Kivuli huundwa kwa kuchanganya na nyeusi, na kupunguza mwangaza. Fomula ya tinti ni: new = base + (255 - base) × factor. Kwa vivuli: new = base × (1 - factor). Hatua husambazwa kwa usawa kati ya rangi ya msingi na nyeupe tupu (tinti) au nyeusi tupu (vivuli), na kutoa gradieni ya mstari ya thamani za rangi.
Mitego ya Kawaida na Matukio ya Pembeni
Kuchanganya kwa mstari na nyeupe au nyeusi kunaweza kutoa tinti zilizofifia au vivuli vyenye ukungu kwa baadhi ya hue. Njano zinaweza kuonekana za kijani zinapotiwa giza, na bluu zinaweza kupoteza uhai zinapotiwa mwanga. Kwa mizani iliyo sawa kimtazamo, zingatia kutumia nafasi za rangi za OKLCH au CIELAB. Daima hakikisha kuwa tinti zako nyepesi zaidi na vivuli vyako vyeusi zaidi vinadumisha utofautishaji wa kutosha dhidi ya mandharinyuma yaliyokusudiwa.
Wakati wa Kutumia Zana Hii dhidi ya Msimbo
Tumia zana hii ya kivinjari kwa uchunguzi wa haraka na kuzalisha mizani ya rangi wakati wa kazi ya usanifu. Kwa mifumo ya usanifu ya uzalishaji, zalisha tinti na vivuli kwa programu kwa kutumia maktaba za rangi kama chroma.js au culori zinazosaidia nafasi za rangi zilizo sawa kimtazamo na zinaweza kutoa design tokens katika umbizo lolote.