RGB से HSL कलर कन्वर्टर

गणना दर्ज करें

लाल (0-255)

हरा (0-255)

नीला (0-255)

परिणाम

HSL रंग

hsl(9.13, 100%, 63.92%)

ह्यू, सैचुरेशन, लाइटनेस

ह्यू (H)	9.13°
सैचुरेशन (S)	100%
लाइटनेस (L)	63.92%

RGB से HSL कन्वर्टर क्या है?

यह टूल RGB मॉडल (Red यानी लाल, Green यानी हरा, Blue यानी नीला — हर एक 0–255 के बीच) में दिए गए किसी रंग को HSL मॉडल (Hue यानी ह्यू, Saturation यानी सैचुरेशन, Lightness यानी लाइटनेस) में बदल देता है। डिज़ाइनरों के लिए HSL अक्सर ज़्यादा समझ में आने वाला होता है, क्योंकि यह रंग की छटा (ह्यू) को इस बात से अलग कर देता है कि वह कितना चटक (सैचुरेशन) और कितना हल्का या गहरा (लाइटनेस) है। यह रूपांतरण सार्वभौमिक है और किसी भी डिवाइस या देश से बंधा हुआ नहीं है।

RGB मानों को ह: रंगत, संतृप्ति और चमक वाले HSL मॉडल में बदला जाता है।

इसका उपयोग कैसे करें

अपने रंग के लाल, हरे और नीले मान दर्ज करें — हर एक 0 से 255 के बीच। कैलकुलेट दबाएँ और इसके बराबर का HSL ट्रिपल पाएँ, जिसे आप सीधे CSS में hsl(H, S%, L%) के रूप में पेस्ट कर सकते हैं।

फ़ॉर्मूला समझें

सबसे पहले हर चैनल को 255 से भाग देकर सामान्य (normalize) करें, ताकि वह 0–1 की सीमा में आ जाए। मान लीजिए max और min इन तीनों मानों में से सबसे बड़ा और सबसे छोटा हैं, और \(\Delta = \max - \min\)। लाइटनेस होगी \(L = (\max + \min) / 2\)। सैचुरेशन होगी \(S = \Delta / (1 - \lvert 2L - 1 \rvert)\), या जब \(\Delta = 0\) हो (यानी ग्रे रंग) तब 0। ह्यू उस चैनल से निकाली जाती है जो सबसे बड़ा हो, और उसे \(60^{\circ}\) से गुणा करके 0–360° की सीमा में लपेट दिया जाता है।

$$L = \frac{C_{\max} + C_{\min}}{2}, \quad S = \frac{C_{\max} - C_{\min}}{1 - \lvert 2L - 1 \rvert}$$ $$\text{where}\quad \left\{ \begin{aligned} R^{\prime} &= \frac{\text{Red}}{255}, \;\; G^{\prime} = \frac{\text{Green}}{255}, \;\; B^{\prime} = \frac{\text{Blue}}{255} \\ C_{\max} &= \max(R^{\prime}, G^{\prime}, B^{\prime}), \;\; C_{\min} = \min(R^{\prime}, G^{\prime}, B^{\prime}) \end{aligned} \right.$$ $$H = 60^{\circ} \times \begin{cases} \dfrac{G^{\prime} - B^{\prime}}{\Delta} \bmod 6 & C_{\max} = R^{\prime} \\[0.6em] \dfrac{B^{\prime} - R^{\prime}}{\Delta} + 2 & C_{\max} = G^{\prime} \\[0.6em] \dfrac{R^{\prime} - G^{\prime}}{\Delta} + 4 & C_{\max} = B^{\prime} \end{cases}$$

रंगत कोण है, संतृप्ति अक्ष से दूरी, और चमक ऊर्ध्वाधर स्थिति है।

हल किया गया उदाहरण

टमाटर जैसा लाल रंग RGB(255, 99, 71) लीजिए। सामान्यीकृत मान: \(R=1\), \(G=0.388\), \(B=0.278\)। \(\max=1\), \(\min=0.278\), \(\Delta=0.722\)। \(L = (1 + 0.278)/2 = 0.639 \to 63.9\%\)। \(S = 0.722 / (1 - \lvert 2\cdot 0.639 - 1 \rvert) = 0.722 / 0.722 = 1 \to 100\%\)। चूँकि \(\max = R\) है, इसलिए \(H = 60 \times ((0.388 - 0.278)/0.722) = 60 \times 0.1525 \approx 9.13^{\circ}\)। परिणाम: hsl(9.13, 100%, 63.92%)।

अक्सर पूछे जाने वाले सवाल

ग्रे रंगों के लिए सैचुरेशन 0 क्यों होती है? जब तीनों चैनल बराबर होते हैं, तो \(\Delta = 0\) हो जाता है, यानी कोई रंग संबंधी जानकारी ही नहीं बचती और सैचुरेशन अपरिभाषित (undefined) होती है — परंपरा के अनुसार इसे 0 मान लिया जाता है।

क्या H, S, L को राउंड किया जाता है? स्क्रीन पर दिखने वाले मान दो दशमलव तक राउंड किए जाते हैं, लेकिन भीतर गणना किए गए असली मान पूरी सटीकता के साथ रखे जाते हैं।

क्या मैं वापस बदल सकता हूँ? हाँ — HSL से RGB इसकी उलटी प्रक्रिया है, जिसमें ह्यू सेक्टर और क्रोमा का इस्तेमाल होता है।