रंग को HEX, RGB और HSL के बीच बदलें
प्रकाशित: · अद्यतन: 2 मिनट का पाठ
HEX, RGB और HSL एक ही रंग को तीन तरीकों से बताते हैं। टूल तीनों एक साथ दिखाता है और आम रूप स्वीकार करता है; HSL को पूर्णांक में गोल करने से वह एक स्तर का अंतर समझ आता है जो HEX पर लौटने पर दिखता है।
एक ही रंग के तीन रूप
रंग एक्सप्लोर करें डिफ़ॉल्ट रूप से तीनों रूप रंग के पूर्वावलोकन के साथ दिखाता है। हरे रंग #2F4A3F के लिए:
| रूप | नतीजा |
|---|---|
| HEX | #2f4a3f |
| RGB | rgb(47, 74, 63) |
| HSL | hsl(156, 22%, 24%) |
पैनल के तीन HEX, RGB और HSL बटन नतीजे को एक ही रूप तक सीमित कर देते हैं, जैसा है वैसा कॉपी करने के लिए सुविधाजनक।
स्वीकार्य रूप
| रूप | उदाहरण | HEX नतीजा |
|---|---|---|
| छोटा HEX | #fff | #ffffff |
| पारदर्शिता वाला HEX | #2F4A3F80 | #2f4a3f80 |
| कॉमा वाला RGB | rgb(47, 74, 63) | #2f4a3f |
| स्पेस वाला RGB | rgb(47 74 63) | #2f4a3f |
| प्रतिशत में RGB | rgb(100%, 0%, 0%) | #ff0000 |
| स्पेस वाला HSL | hsl(156 22% 24%) | #304b40 |
“rouge” जैसे रंग-नाम और 0 से 255 से बाहर के चैनल, जैसे rgb(300, 0, 0), एक ऐसे संदेश के साथ अस्वीकार किए जाते हैं जो स्वीकार्य रूपों की सूची देता है।
पारदर्शिता
पारदर्शिता HEX में आठ अंकों से लिखी जाती है, या स्पेस के साथ स्लैश के बाद। रंग rgb(47 74 63 / 50%) का HEX में #2f4a3f80 और RGB में rgba(47, 74, 63, 0.5) बनता है। उलटे, #2F4A3F80 की अपारदर्शिता 0.502 आती है, क्योंकि हेक्साडेसिमल में 80 यानी 255 में से 128।
आने-जाने में एक स्तर का बदलाव क्यों
HSL पूर्ण संख्याओं में दिखाया जाता है: रंगत अंशों में, संतृप्ति और चमक प्रतिशत में। इसलिए HSL से HEX पर लौटने पर आप पड़ोसी रंग पर पहुँचते हैं, शुरुआती रंग पर नहीं।
| शुरुआत | दिखाया गया HSL | HEX पर वापसी |
|---|---|---|
| #2F4A3F | hsl(156, 22%, 24%) | #304b40 |
| #B5532E | hsl(16, 59%, 45%) | #b6532f |
अंतर हर चैनल पर एक स्तर का है, आँख को अदृश्य। डिज़ाइन टोकन या ब्रांड के लिए मूल HEX को संदर्भ रखें और दोबारा HSL से न गुज़ारें।
धूसर
धूसर रंग की संतृप्ति शून्य होती है और रंगत का कोई असर नहीं होता: #808080 से rgb(128, 128, 128) और hsl(0, 0%, 50%) मिलते हैं।
टूल क्या नहीं नापता
फ़ॉर्मेट रूपांतरण पठनीयता के बारे में कुछ नहीं कहता। टूल टेक्स्ट और उसकी पृष्ठभूमि के बीच कंट्रास्ट की गणना नहीं करता: प्रकाशित करने से पहले उसे अलग से जाँचें। QR कोड का मामला, जहाँ कंट्रास्ट पठनीयता तय करता है, ऐसा QR कोड बनाएँ जो पहली बार में स्कैन हो में है।
रूपांतरण जाँचें
- रंग को फ़ील्ड में चिपकाएँ: पूर्वावलोकन आपकी अपेक्षा से मेल खाना चाहिए।
- वह रूप कॉपी करें जो आपका सिस्टम माँगता है।
- सटीक रंग रखने के लिए HSL की जगह HEX या RGB रखें।