कलर कन्वर्टर

HEX, RGB, HSL, HSV और CMYK के बीच बदलें। लाइव पूर्वावलोकन। एक्सेसिबिलिटी के लिए WCAG कंट्रास्ट चेकर। कुछ भी आपके ब्राउज़र से नहीं जाता।

कलर कन्वर्टर कैसे काम करता है

Color Converter टाइप करते ही किसी भी रंग को HEX, RGB, HSL, HSV और CMYK फ़ॉर्मेट के बीच बदल देता है। यह आपके द्वारा चुने गए दो रंगों के बीच WCAG कंट्रास्ट चेक भी चलाता है, जो कंट्रास्ट रेशियो और नॉर्मल टेक्स्ट, लार्ज टेक्स्ट तथा UI कॉम्पोनेंट के लिए AA/AAA पास/फ़ेल रिज़ल्ट दिखाता है। सभी गणनाएँ ब्राउज़र में होती हैं, कोई डेटा कहीं नहीं भेजा जाता; आपका टाइप किया कुछ भी आपके डिवाइस से बाहर नहीं जाता।

डिज़ाइन हैंडऑफ़ में यह समझना उपयोगी होता है कि एक ही रंग अलग-अलग कलर मॉडल में कैसा दिखता है। कोई डिज़ाइनर ब्रांड रंग को HEX #1A4F8C के रूप में बता सकता है; किसी CSS डेवलपर को थीमिंग के लिए HSL समतुल्य चाहिए; प्रिंट टीम को CMYK ब्रेकडाउन चाहिए। यह टूल एक साथ सभी दिशाओं में बदलाव करता है ताकि आपको कभी अलग-अलग कन्वर्टर न चलाने पड़ें।

लिखा है Bastien Sulyan

कलर कन्वर्टर: चरण दर चरण उपयोग विधि

एक HEX value टाइप करें, color swatch पर क्लिक करें, या respective fields में RGB, HSL, HSV या CMYK values दर्ज करें।
अन्य सभी format representations तुरंत equivalent color दिखाने के लिए अपडेट होते हैं।
Contrast check चलाने के लिए दो color pickers का उपयोग करके foreground और background color चुनें।
WCAG contrast ratio और AA तथा AAA compliance levels के लिए pass/fail badges पढ़ें।
प्रत्येक field के बगल में copy icon का उपयोग करके कोई भी color value कॉपी करें।

सामान्य उपयोग के मामले

एक UI डिज़ाइनर थीमिंग सिस्टम के लिए CSS कस्टम प्रॉपर्टी लिखने के लिए ब्रांड HEX कोड को HSL में बदलता है।
एक वेब डेवलपर कॉम्पोनेंट पब्लिश करने से पहले WCAG AA अनुपालन की पुष्टि करने के लिए टेक्स्ट रंग और बैकग्राउंड के बीच कंट्रास्ट रेशियो जांचता है।
एक प्रिंट डिज़ाइनर को वेब HEX रंग मिलता है और छपे हुए ब्रोशर में उससे मेल खाने के लिए CMYK समतुल्य चाहिए।
एक डेवलपर को कैनवस ड्रॉइंग फ़ंक्शन में अलग-अलग चैनल वैल्यू भेजने के लिए डिज़ाइन टोकन का RGB ब्रेकडाउन चाहिए।

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

क्या टूल alpha (transparency) values का समर्थन करता है?

वर्तमान converter पूरी तरह opaque colors (alpha = 1) के साथ काम करता है। HEXA (8-digit hex) और RGBA अभी scope में नहीं हैं। Opacity के लिए, CSS में rgba() या oklch() notation का उपयोग करके alpha channel अलग से सेट करें।

क्या मेरे दर्ज किए गए रंग कहीं स्टोर या भेजे जाते हैं?

नहीं। Color conversion pure arithmetic (channel remapping और range scaling) है जो पूरी तरह ब्राउज़र के JavaScript engine में चलती है। यहां टाइप किया गया कुछ भी किसी सर्वर या बाहरी सेवा तक नहीं पहुंचता।

Checker कौन से WCAG contrast levels का समर्थन करता है?

टूल WCAG 2.1 सक्सेस क्राइटेरिया के अनुसार बताता है: AA के लिए नॉर्मल टेक्स्ट (18pt या बोल्ड में 14pt से कम) के लिए न्यूनतम 4.5:1 और लार्ज टेक्स्ट तथा UI कॉम्पोनेंट के लिए 3:1 कंट्रास्ट रेशियो ज़रूरी है। AAA के लिए नॉर्मल टेक्स्ट के लिए 7:1 और लार्ज टेक्स्ट के लिए 4.5:1।

इस टूल और professional design software में CMYK values अलग क्यों हैं?

यह टूल RGB-to-CMYK conversion जो mathematical formula से करता है वह color profile के बिना है। Professional design applications ICC color profiles लागू करती हैं जो ink dot gain और substrate properties का हिसाब लगाती हैं। यहां CMYK values approximation के लिए उपयोगी हैं; production print के लिए dedicated software में हमेशा press profile लागू करें।

क्या मैं यहाँ 'cornflowerblue' जैसे CSS कलर नेम को बदल सकता हूँ?

CSS नेम्ड कलर को कन्वर्टर फ़ील्ड में सीधे टाइप नहीं किया जा सकता। नेम्ड कलर को बदलने के लिए, पहले CSS रेफ़रेंस में उसकी HEX वैल्यू ढूँढें (cornflowerblue #6495ED है), फिर वह HEX वैल्यू HEX फ़ील्ड में पेस्ट करें ताकि बाकी सभी फ़ॉर्मेट दिखें।

क्या पेज लोड होने के बाद टूल ऑफलाइन काम करता है?

हाँ। Color conversion arithmetic है जिसकी कोई बाहरी dependency नहीं। एक बार पेज आपके ब्राउज़र cache में हो जाने पर आप network connection के बिना खोल सकते हैं और सभी conversions सामान्य रूप से काम करेंगी।