Beddelaha HSL to HEX

Waxa boggani kuu sameeyo

Boggan wuxuu u beddelaa midabka HSL (Hue, Saturation, Lightness) oo ah qaabka dadku u fikiraan midabka, una beddelaa HEX (lix-god oo tirada lixleyda ah) oo ah qaabka ugu caansan ee CSS iyo aaladaha naqshadaynta loo isticmaalo. Waxaad gashaa saddex qiyam: Hue (0–360), Saturation (0–100%), iyo Lightness (0–100%). Tusaale ahaan: 243, 75%, 59%. Isla markiiba waxaad aragtaa koodka HEX ee u dhigma, sida #4f46e5. Haddii midabka RGB uu u oggolaan karo qaabka saddex-godka ah (shorthand), sida #abc, waa la tusi doonaa sidoo kale. Dhammaan qaababka kale ee midabka (RGB, HSV, CMYK, LAB) ayaa isla waqtigaas la cusboonaysiiyaa. Hawluhu wuxuu ku dhacaa browserkaaga, wax gelisna lama soo diro server-rada.

Maxaa boggan ka dhigaya mid ka duwan?

Inta badan aaladaha midabada beddelku waxay bixiyaan beddelka u dhexeeya dhowr qaab, laakiin boggani wuxuu u go'ayaa aynaan HSL-ka oo dhan HEX-ka. HSL waa qaab midab oo loogu talagalay in dadku si fudud uga fikiraan midabka – iyada oo la beddelayo Lightness keliya, Hue waa isku mid, taasoo muhiim u ah abuurista palettes-ka iyo mawduucyada. HEX, dhanka kale, waa lix-god oo tirada lixleyda ah (sida #RRGGBB) oo ah qaabka RGB; wax ma qaado alpha-ga marka laga reebo qaabka sideed-godka ah. Beddelka HSL → HEX waa toosnaan, lama hagaajiyo, oo kuma luma wax macluumaad ah inta uu ku jiro gamut-ka RGB. Kuma dhici karto hababka kale sida LAB ama CMYK, kuwaas oo laga yaabo inay hagaajiyaan midabyada ka baxsan gamut-ka.

Sida loo isticmaalo: gelinta iyo soo saarista

Gelinta:

• H (Hue) – 0 ilaa 360 (waxay ku xidhan tahay meereyda midabka).
• S (Saturation) – 0% ilaa 100% (tirada midabaynta).
• L (Lightness) – 0% ilaa 100% (ifitaanka ama mugdiga).

Tusaale: 210, 60%, 80% waa midab buluug khafiif ah.

Soo saarista:

• HEX lix-god (tusaale #87CEEB). Haddii mid kasta oo ka mid ah RR, GG, BB uu noqon karo hal xaraf (0–15), qaabka saddex-godka ah ayaa la tusi karaa, tusaale #8CE.
• RGB, HSV, CMYK, iyo LAB sidoo kale waa la soo saaraa.
• Haddii gelinta HSL ka baxdo xuduudaha, waxaad aragtaa fariin qalad:
  "Gali HSL sida hue 0–360 oo leh laba boqolkiiba, sida 243, 75%, 59%."

Xeerarka:

• Wax ka beddelashada mid kasta oo ka mid ah aagagga isla markiiba waxay cusboonaysiisaa dhammaan kuwa kale.
• Beddelka HSL → HEX had iyo jeer wuxuu ku jiraa RGB gamut-ka; ma jiro hagaajin ka baxsan.
• CMYK-ga la muujiyo waa qiyaas kaliya oo kala duwanaan kara daabacaadda xirfadeed.

Ciladaha iyo xuduudaha

Qaladka ugu badan waa:

1. Hubi in Hue u dhexeyso 0–360. Tusaale: 400, 50%, 50% ma shaqeeyo.
2. S iyo L waxay u baahan yihiin calaamadda %. 50 ma aha 50%.
3. Qaabka qoraalka waa inuu yahay sida 210, 60%, 80% ama 210 60% 80% – xarfo qaldan ama calaamad la'aan waxay keenaysaa qalad.
4. Haddii aad isticmaasho jajab tobanle (tusaale 210.5), waa la aqbali karaa (Hue waa tiro dhab ah), laakiin S iyo L waa inay yihiin tiro dhammays tiran ama jajab leh oo leh %.
5. Midabka madow (L=0%) wuxuu bixiyaa HEX #000000, midabka cad (L=100%) wuxuu bixiyaa #FFFFFF.

Cidda u baahan qalabkan

• Naqshadeeyayaasha (designers) oo ku abuura palettes-ka HSL, markaas u baahan HEX si ay ugu dhex galiyaan CSS ama aaladaha naqshadaynta sida Figma, Sketch.
• Horumarinta soo-saareyaasha (front-end developers) oo hela qiyamka HSL naqshadeeyayaasha oo u duuban koodka HEX ee CSS.
• Qof kasta oo hagaajinaya mawduucyada iyada oo la beddelayo Lightness si loo xaqiijiyo heerka isbarbardhiga (WCAG), ka dibna u rogayo HEX.

Tusaale: Waxaad rabtaa inaad abuurto midab buluug leh oo khafiif ah (Lightness 80%) si loo isticmaalo asalka, laakiin qoraalka waa inuu cad yahay (Lightness 90%). Qalabkani wuxuu kaa caawinayaa inaad si dhakhso leh u aragto HEX-ka.

Fahamka beddelka HSL → HEX

Beddelku wuxuu maraa laba tallaabo: HSL → RGB, ka dibna RGB → HEX.
HSL → RGB:

• S iyo L waxay go'aamiyaan qiyamka RGB.
• Halkan waxaa loo adeegsadaa algorithm-ka caadiga ah: haddii S=0, midabku waa cawl (L*255).
• Haddii S>0, qiyamka RGB waxay ku xiran yihiin qaybinta meereyda (hue wheel) oo loo yaqaan 'chroma'.
• Tusaale ahaan, HSL(243, 75%, 59%) – midab buluug dhexdhexaad ah.
  • Chroma = (1 - |2L - 1|) × S = (1 - |0.18|) × 0.75 = 0.82 × 0.75 = 0.615.
  • X = Chroma × (1 - |(Hue/60) mod 2 - 1|). Halkan Hue=243, Hue/60=4.05, qaybta jajabka = 0.05. Sidoo kale X = 0.615 × (1 - |4.05 mod 2 - 1|) = 0.615 × (1 - |0.05 -1|) = 0.615 × 0.05? Haa, waan qadarin. Laakiin si fudud: RGB waa R=0.31, G=0.27, B=0.90 (qiyaas).
  • Ka dibna RGB-gaas waxaa loo rogaa HEX: 0.31255≈79 → #4F, 0.27255≈69 → #45, 0.90*255≈230 → #E6. Marka HEX waa #4F45E6 (oo u dhow #4f46e5).

RGB → HEX:

• Mid kasta oo RGB ah (0–255) waxaa loo qoraa sida laba-god oo lixleey ah (0–9, A–F).
• Tusaale: R=79 → 79/16=4 (4*16=64), 79-64=15 → F, marka 4F.
• Haddii mid kasta uu ka yar yahay 16 (tusaale R=10, G=10, B=10), HEX wuxuu noqon karaa #AAA (qaabka saddex-godka ah).

Su'aalo inta badan la isweydiiyo

1. Maxaa dhacaya haddii aan geliyo Hue 400?
   Waxaad aragtaa farriinta qaladka: "Gali HSL sida hue 0–360 oo leh laba boqolkiiba". Hue waa inuu u dhexeeyo 0 ilaa 360.

2. Miyaan isticmaali karaa jajab tobanle S iyo L?
   Haa, laakiin waa inay la socdaan calaamadda %, sida 25.5%. Qalabku wuxuu aqbalayaa jajab tobanle.

3. Maxay tahay farqiga u dhexeeya HEX lix-god iyo saddex-god?
   Lix-god waa qaab buuxa oo RGB ah (tusaale #4f46e5). Saddex-god waa qaab la soo gaabiyey oo loo isticmaalo marka mid kasta oo RGB ah la qori karo hal xaraf oo lixleey ah (tusaale #abc waxay la mid tahay #aabbcc). Waa qaab CSS ah oo shaqeeya haddii labada xaraf ee RGB mid kasta ay isku mid yihiin.

4. Ma beddeli karaa midabka aan ka baxsan yahay RGB gamut-ka?
   Maya, HSL dhammaanteed wuxuu u dhigmaa RGB gamut-ka. Ma jiro midab ka baxsan sRGB. Kala duwanaan gaaban ayaa jiri kara marka la eego Lab, laakiin beddelka HSL → HEX waa toosnaan.

5. Maxaa sababa in CMYK-ga la muujiyo uu ka duwan yahay daabacaadda dhabta ah?
   Sida lagu xusay xaashida xaqiiqda, CMYK-ga soo baxa waa qiyaas kaliya oo laga soo qaatay RGB. Daabacaadda xirfadeed waxay adeegsataa profillada midab ee kala duwan, sida CMYK coated ama uncoated, taasoo keenaysa kala duwanaansho.

6. Waa maxay macnaha "lossless" ee beddelka HSL → HEX?
   Macneheedu waa in midabka HSL marka la rogo RGB, oo markaas loo rogo HEX, aan laga lumin wax macluumaad ah inta uu ku jiro gamut-ka RGB. Si kastaba ha ahaatee, marka la rogo RGB oo loo rogo HEX, jajabka RGB (tusaale 0.5) waa in la soo koobaa ilaa tirada dhammays tiran (0–255), taas oo keeni karta khasaare yar. Laakiin tani waa dabiici, ma aha mid gaar ah beddelkan.