HEX, RGB, HSL: वेब रंग कोड समझें
आप एक वेबसाइट संपादित कर रहे हैं और CSS में #FF5733 देखते हैं। या एक डिज़ाइनर आपको rgb(255, 87, 51) भेजता है। या एक डिज़ाइन टूल रंग को hsl(11, 100%, 60%) दिखाता है। ये सभी बिल्कुल एक ही रंग का वर्णन करते हैं, एक जीवंत लाल-नारंगी, लेकिन तीन अलग-अलग फ़ॉर्मेट में।
डिजिटल रंग कैसे काम करते हैं
आपकी स्क्रीन पर हर रंग प्रकाश के तीन प्राथमिक रंगों को मिलाकर बनाया जाता है: लाल, हरा, और नीला। यह RGB रंग मॉडल है।
HEX रंग
HEX रंग कोड एक हैश प्रतीक के बाद छह वर्णों की स्ट्रिंग है। छह वर्ण तीन जोड़ों में विभाजित हैं, प्रत्येक हेक्साडेसिमल में एक रंग चैनल का प्रतिनिधित्व करता है।
#FF5733 का विश्लेषण: FF = लाल 255 पर, 57 = हरा 87 पर, 33 = नीला 51 पर।
RGB रंग
RGB नोटेशन सीधे 0 से 255 तक दशमलव संख्याओं के रूप में लाल, हरा और नीला चैनल मान बताता है।
rgb(255, 87, 51) का मतलब: लाल: 255, हरा: 87, नीला: 51।
HSL रंग
HSL का अर्थ है Hue, Saturation, Lightness। यह रंग का वर्णन उस तरह करता है जैसे मनुष्य स्वाभाविक रूप से रंग के बारे में सोचते हैं।
Hue रंग चक्र पर डिग्री (0-360) में रंग है। Saturation रंग कितना जीवंत है। Lightness रंग कितना हल्का या गहरा है।
क्या आप जानते हैं? HSL को सबसे डिज़ाइनर-अनुकूल रंग फ़ॉर्मेट माना जाता है क्योंकि यह मैप करता है कि हम स्वाभाविक रूप से रंगों का वर्णन कैसे करते हैं। "इसे थोड़ा हल्का करें" का मतलब L मान बढ़ाएं। "इसे कम जीवंत बनाएं" का मतलब S मान घटाएं।
कब कौन सा फ़ॉर्मेट उपयोग करें
| फ़ॉर्मेट | सर्वश्रेष्ठ उपयोग | लाभ |
|---|---|---|
| HEX | CSS स्टाइलशीट, डिज़ाइन स्पेक | कॉम्पैक्ट, सार्वभौमिक रूप से समझा जाता है |
| RGB | प्रोग्रामेटिक रंग हेरफेर | सहज चैनल मान |
| HSL | डिज़ाइन कार्य, रंग योजनाएं बनाना | मानव रंग धारणा से मेल खाता है |
सुझाव HEX, RGB, HSL और अधिक के बीच कनवर्ट करें: रंग कोड कैसे कनवर्ट करें। किसी भी फ़ॉर्मेट में कोई भी रंग दर्ज करें और तुरंत सभी अन्य प्राप्त करें।
रंगों के साथ काम करना शुरू करें:
सभी टूल्स मुफ़्त हैं और सीधे आपके browser में काम करते हैं।