यादृच्छिक रंग जनरेटर

क्या आपको किसी मॉकअप, चार्ट या खाली कैनवास के लिए रंग की आवश्यकता है, और आप आदत के वश कोई रंग नहीं चुनना चाहते? यह मुफ़्त यादृच्छिक रंग जनरेटर स्क्रीन द्वारा दिखाए जा सकने वाले पूरे 24-bit दायरे से रंग चुनता है और हर रंग को उसके कोड के साथ एक रंग नमूने पर दिखाता है। फ़ील्ड “चयन की संख्या” में तय करें कि आपको कितने रंग चाहिए — 1 से 50 के बीच कोई भी संख्या — अपनी ज़रूरत के फ़ॉर्मैट चुनें और “जनरेट करें” बटन दबाएँ। यह पेज पहले से ही HEX में एक रंग के साथ खुलता है, इसलिए पहला परिणाम केवल एक क्लिक की दूरी पर है। चेकबॉक्स “HEX कोड” शुरुआत से ही चुना हुआ है, “RGB कोड” और “HSL कोड” इसके ठीक बगल में हैं, और इन तीनों के किसी भी संयोजन को एक साथ चालू किया जा सकता है। “जनरेट करें” के बगल में स्थित गियर बटन “उन्नत विकल्प” पैनल खोलता है, जहाँ आप रंगों को किसी एक प्रकार या सीमा तक सीमित कर सकते हैं, दोहराव रोक सकते हैं और HEX कोड लिखने का तरीक़ा बदल सकते हैं।

प्रत्येक रंग आपके ब्राउज़र में Web Crypto API (crypto.getRandomValues) के ज़रिए तैयार किया जाता है, जो आपके सिस्टम के अपने यादृच्छिक स्रोत से क्रिप्टोग्राफ़िक रूप से मज़बूत रैंडम बाइट्स प्रदान करता है, न कि Math.random() जैसे किसी छद्म-यादृच्छिक फ़ंक्शन द्वारा। स्क्रीन पर दिखने वाला रंग तीन चैनलों — लाल, हरा और नीला — से मिलकर बनता है, जिनमें से प्रत्येक 0 से 255 तक का एक पूर्णांक होता है, और एक रैंडम बाइट ठीक 256 मान ले सकता है। इसलिए प्रत्येक चैनल केवल एक बाइट होता है, जिसके बीच कोई अन्य प्रक्रिया नहीं होती: न कोई शेषफल निकाला जाता है और न ही किसी रूपांतरण चरण द्वारा किसी विशेष शेड का पक्ष लिया जाता है। यही कारण है कि जब भी आप “जनरेट करें” दबाते हैं, तो पेज द्वारा तैयार किए जा सकने वाले सभी 16,777,216 रंगों के आने की संभावना बिल्कुल समान होती है। पैनल “उन्नत विकल्प” में तय की गई संकीर्ण सीमा भी इस नियम का पालन करती है: रंग तब भी पूरे स्पेस से चुने जाते हैं और सीमा से बाहर आने वाले रंगों को अलग कर दिया जाता है, जिससे तय सीमा के भीतर आने वाले हर रंग को बराबर अवसर मिलता है। सर्वर पर कुछ भी नहीं भेजा जाता, कुछ भी लॉग नहीं होता, और एक बार पेज लोड हो जाने के बाद यह इंटरनेट बंद होने पर भी काम करता रहता है।

ये तीनों फ़ॉर्मैट एक ही रंग को तीन अलग-अलग तरीक़ों से दर्शाते हैं। फ़ॉर्मैट “HEX कोड” छह अंकों वाला रूप है जिसका उपयोग CSS और अधिकांश डिज़ाइन टूल में किया जाता है, जैसे #0778ff; इसे शुरुआत में # के साथ छोटे अक्षरों में लिखा जाता है, और पैनल “उन्नत विकल्प” में दिए गए विकल्प “अपरकेस” तथा “# के बिना” उन टूल के लिए इसे बदल देते हैं जो अलग प्रारूप की अपेक्षा करते हैं। फ़ॉर्मैट “RGB कोड” तीनों चैनलों को अलग-अलग दर्शाता है, जैसे rgb(7, 120, 255), जो प्रत्येक चैनल पर अलग से काम करने वाले कोड के लिए सबसे उपयुक्त है। फ़ॉर्मैट “HSL कोड” रंग को ह्यू, संतृप्ति और हल्कापन के आधार पर परिभाषित करता है, जैसे hsl(213, 100%, 51%), जिसे बाद में मैन्युअल रूप से बदलना सबसे आसान होता है। ये तीनों सीधे स्टाइलशीट में पेस्ट किए जा सकते हैं। हालाँकि, वे सभी एक समान सटीक नहीं हैं। HEX और RGB सटीक हैं; HSL राउंडेड है। यह पेज ह्यू, संतृप्ति और हल्कापन को पूर्णांकों के रूप में लिखता है, और लगभग 89% रंगों के लिए यह राउंडेड मान वापस बदलने पर ठीक उसी रंग में नहीं बदलता: उदाहरण के लिए #646503 को hsl(61, 94%, 20%) के रूप में दिखाया जाता है, जो वापस बदलने पर #616303 बनता है। यह अंतर किसी चैनल में 5 स्टेप्स से अधिक नहीं होता और आमतौर पर 1 या 2 ही होता है — जो स्क्रीन पर तो दिखाई नहीं देता, लेकिन यदि आप HSL मान सहेजते हैं और मूल HEX की उम्मीद करते हैं तो यह मायने रखता है। इसलिए मान को HEX या RGB में ही सहेजें।

एक रंग परिणाम के बीच में एक ब्लॉक के रूप में दिखाई देता है; एक से अधिक रंग क्रमांकित सूची के रूप में आते हैं, जिसमें प्रति पंक्ति एक रंग होता है, चुने गए फ़ॉर्मैट अगल-बगल होते हैं और अंत में एक छोटा कंट्रास्ट बैज होता है। तीन से अधिक रंगों की सूची बॉक्स के अंदर स्क्रॉल होती है, और कोने में बना तीर इसे पूरी ऊंचाई तक फैला देता है; आप इसे जिस स्थिति में छोड़ते हैं, पेज उसे याद रखता है। केवल उसी कोड को कॉपी करने के लिए उस कोड पर क्लिक करें। पंक्ति के अंत में दिया गया कॉपी बटन उस रंग के सभी कोड को एक ही पंक्ति में स्पेस के साथ कॉपी कर देता है। रंग नमूने पर क्लिक करने से आपके ब्राउज़र का अपना कलर पिकर खुल जाता है: वहाँ कोई दूसरा रंग चुनें और उस पंक्ति के सभी कोड हर चालू फ़ॉर्मैट में उसी नए रंग के अनुसार बदल जाते हैं, और उसका बैज भी। बटन “सभी कॉपी करें” पूरे बैच को प्रति पंक्ति एक रंग के रूप में कॉपी करता है, और “फ़ाइल में सहेजें” उसी टेक्स्ट को एक सामान्य .txt फ़ाइल में लिखता है; दोनों ही पिकर में बदले गए किसी भी रंग को शामिल करते हैं। “इतिहास” अनुभाग आपके पिछले 10 बैचों को इसी ब्राउज़र में सुरक्षित रखता है, ठीक वैसे ही जैसे वे जनरेट हुए थे, और बटन “साफ़ करें” परिणाम को खाली कर देता है। आपकी सेटिंग्स, जिनमें “उन्नत विकल्प” की सेटिंग्स भी शामिल हैं, अगली विज़िट के लिए याद रखी जाती हैं।

समान रूप से संभावित रंग दिखने में हमेशा एक जैसे फैले हुए नहीं लगते, और यह समझना आपको बेवजह “जनरेट करें” दबाने से बचाता है। पूरी रेंज में मापने पर, लगभग 35% रंग चमकीले और संतृप्त होते हैं, जिनका HSL में संतृप्ति स्तर कम से कम 70% और हल्कापन 35% से 65% के बीच होता है। 20% से कम संतृप्ति वाले लगभग-ग्रे रंग केवल लगभग 4% होते हैं, और बहुत गहरे रंग (20% से कम हल्कापन) तथा बहुत हल्के रंग (80% से अधिक हल्कापन) प्रत्येक लगभग 3% होते हैं। इसलिए “सभी रंग” में से 10 रंगों के बैच में आमतौर पर कई चटक रंग होंगे और शायद ही कभी कोई पेस्टल या गहरा स्लेटी रंग आए। जब आपको किसी विशेष प्रकार की आवश्यकता हो, तो उसे “रंग का प्रकार” ड्रॉप-डाउन में चुनें: विकल्प “चटक” ठीक उसी चमकीले समूह को रखता है, और “पेस्टल”, “गहरे”, “शांत” तथा “ग्रेस्केल” अपने-अपने समूहों के लिए यही करते हैं। विकल्प “कस्टम” आपको अपने स्वयं के “ह्यू”, “संतृप्ति” और “हल्कापन” की सीमा तय करने की सुविधा देता है, और ह्यू का दायरा 0 के पार भी जा सकता है, जिससे 330 से 30 तक लाल रंग मिलते हैं। यह सीमा पेज पर दिखने वाले HSL कोड के आधार पर जाँची जाती है ताकि कोई कोड इससे बाहर न जाए, और यदि इसमें आपकी “चयन की संख्या” के लिए बहुत कम रंग बचते हैं, तो पेज रंगों को दोहराने के बजाय सीमा बढ़ाने का सुझाव देता है। अन्यथा दोहराव संभव हैं लेकिन दुर्लभ हैं: उन्हें पूरी तरह रोकने के लिए “दोहराव न होने दें” चेक करें; इसके बिना पूरी रेंज से चुने गए 50 रंगों में से किन्हीं दो के एक समान होने की संभावना लगभग 13,700 में 1 होती है।

यादृच्छिक रंग का उपयोग अक्सर बैकग्राउंड के रूप में किया जाता है, जिससे एक ऐसा सवाल उठता है जिसका जवाब कोई रंग नमूना देखकर नहीं दे सकता: क्या उस पर लिखा टेक्स्ट पढ़ने योग्य होगा? वेब एक्सेसिबिलिटी गाइडलाइन, WCAG, सामान्य टेक्स्ट के लिए कम से कम 4.5:1 के कंट्रास्ट अनुपात की सिफ़ारिश करती है। इस पेज द्वारा तैयार किए जा सकने वाले प्रत्येक रंग पर मापने पर, काला टेक्स्ट लगभग 65% रंगों पर उस मानक तक पहुँचता है और सफ़ेद टेक्स्ट लगभग 36% पर, और ऐसा कोई रंग नहीं है जिस पर दोनों विफल हो जाएँ: दोनों में से बेहतर विकल्प हमेशा कम से कम 4.58:1 तक पहुँचता है। इसलिए किसी भी यादृच्छिक बैकग्राउंड के लिए काला या सफ़ेद टेक्स्ट हमेशा पढ़ने योग्य रहेगा, और पेज आपको दिखाता है कि कौन सा बेहतर है। प्रत्येक रंग के साथ एक छोटा बैज होता है जिस पर दोनों में से बेहतर रंग में Aa लिखा होता है और उसके बाद उसका कंट्रास्ट अनुपात दिया होता है। यह अनुपात नीचे की ओर राउंड किया जाता है ताकि मान को बढ़ा-चढ़ाकर न दिखाया जाए, और पिकर में रंग बदलने पर यह तुरंत अपडेट हो जाता है। यह बैज केवल काले और सफ़ेद टेक्स्ट की तुलना करता है; ब्रांड रंग या किसी अन्य टेक्स्ट रंग के लिए दोनों रंगों की जोड़ी किसी कंट्रास्ट चेकर टूल में जाँचें।

यादृच्छिक होना और सामंजस्यपूर्ण होना एक बात नहीं है। एक बैच में प्रत्येक रंग स्वतंत्र रूप से चुना जाता है, जिसमें अन्य रंगों की कोई जानकारी नहीं होती, इसलिए यह जनरेटर डिज़ाइनर के अर्थ में कभी पैलेट नहीं बनाता — न कोई पूरक जोड़े, न एक जैसे रंगों की श्रृंखला, और न ही कोई साझा हल्कापन। एक संकीर्ण सीमा किसी बैच की प्रकृति को बदलती है, लेकिन इस नियम को नहीं: पेस्टल या नीले रंगों की श्रृंखला भी एक-एक करके ही आती है, जिसमें उन्हें आपस में जोड़ने वाला कुछ नहीं होता। यही इसका मुख्य उद्देश्य है: यह आपको वह रंग देता है जिसे आप सामान्यतः नहीं चुनते, जो पुरानी आदत या रचनात्मक रुकावट को तोड़ता है। किसी यादृच्छिक रंग को उपयोगी बनाने के लिए, अपनी पसंद का रंग अपने पास रखें और उसके इर्द-गिर्द अन्य रंग तैयार करें, बजाय इसके कि आप तब तक “जनरेट करें” दबाते रहें जब तक कि पूरा सेट अपने आप मेल न खा जाए। हल्के और गहरे वेरिएंट पाने के लिए उसके ह्यू को स्थिर रखकर हल्कापन बदलें, या विपरीत रंग पाने के लिए ह्यू को 180 डिग्री घुमाएँ। फ़ॉर्मैट “HSL कोड” इन बदलावों को अनुमान के बजाय सीधी गणना बना देता है।

यह यादृच्छिक रंग जनरेटर क्यों चुनें?

• Web Crypto API के साथ सीधे आपके ब्राउज़र में बना हर रंग, कुछ भी अपलोड नहीं होता
• सभी 16,777,216 रंग बिल्कुल समान रूप से संभावित, प्रति चैनल एक रैंडम बाइट
• एक ही रंग के लिए HEX, RGB और HSL कोड, किसी भी संयोजन में
• एक साथ 50 रंग तक, हर रंग अपने रंग नमूने और टेक्स्ट-कंट्रास्ट बैज के साथ
• चटक, पेस्टल, गहरे, शांत और ग्रेस्केल, या आपकी अपनी ह्यू, संतृप्ति और हल्कापन रेंज
• ज़रूरत पड़ने पर दोहराव न होने दें, और अपरकेस या # के बिना HEX कोड
• कॉपी करने के लिए किसी कोड पर क्लिक करें, या ब्राउज़र के कलर पिकर में रंग बदलें
• सभी कॉपी करें, फ़ाइल में सहेजें और पिछले 10 बैचों का इतिहास, आपके ब्राउज़र में सुरक्षित
• मुफ़्त और असीमित: कोई साइन-अप नहीं, कोई कोटा नहीं, हमारे सर्वर पर कुछ भी सहेजा नहीं जाता

यादृच्छिक रंग वहाँ सबसे अधिक उपयोगी साबित होते हैं जहाँ किसी के निर्णय लेने से पहले ही रंग की आवश्यकता होती है। डिज़ाइनर रचनात्मक रुकावट को दूर करने और ऐसा शुरुआती बिंदु खोजने के लिए इनका उपयोग करते हैं जहाँ उनका सामान्य पैलेट कभी नहीं पहुँच पाता। डेवलपर्स मॉकअप, प्लेसहोल्डर और अवतार भरते हैं, मुख्य थीम तय होने से पहले चार्ट की प्रत्येक श्रृंखला को उसका अपना रंग देते हैं, और यह परीक्षण करते हैं कि इंटरफ़ेस उन पृष्ठभूमियों के साथ कैसे काम करता है जिनके लिए इसे डिज़ाइन नहीं किया गया था — “सभी रंग” में से 50 रंगों के बैच में लगभग हमेशा कम से कम एक बहुत गहरा या बहुत हल्का रंग शामिल होता है, और विकल्प “गहरे” या “पेस्टल” परीक्षण को किसी एक छोर पर केंद्रित करता है। जनरेटिव आर्टिस्ट और गेम प्रोटोटाइप डेवलपर्स इन मानों को सीधे अपने कोड में उपयोग करते हैं, जहाँ RGB रूप अधिकांश ग्राफ़िक्स लाइब्रेरी के अनुकूल होता है। शिक्षक यह दिखाने के लिए तीनों फ़ॉर्मैट को अगल-बगल रखते हैं कि एक ही रंग को एक कोड के रूप में, तीन चैनलों के रूप में या रंग चक्र पर एक स्थिति के रूप में कैसे लिखा जा सकता है, और HSL संस्करण को राउंड क्यों किया जाता है। इसके अलावा किसी सूची को लेबल, टैग या कलर-कोड करने वाले किसी भी व्यक्ति को यह सोचे बिना अलग-अलग रंग मिल जाते हैं कि कौन सा चुना जाए।

कुछ सीमाओं को जान लेना भी आवश्यक है। यह एक जनरेटर है, पैलेट टूल नहीं: यह रंगों का सामंजस्य नहीं बनाता और दूसरों के बदलने पर किसी एक रंग को स्थिर नहीं रखता, और संकीर्ण सीमा एक ही प्रकार के रंग देती है, न कि ऐसे रंग जिन्हें एक साथ मेल खाने के लिए चुना गया हो। कंट्रास्ट बैज केवल काले और सफ़ेद टेक्स्ट की तुलना करता है। यह पेज स्क्रीन पर प्रदर्शित होने वाले sRGB रंगों — HEX, RGB और HSL — में काम करता है, जिसमें कोई पारदर्शिता नहीं होती और न ही कोई CMYK, Pantone, OKLCH या नामित CSS रंग शामिल हैं; प्रिंट के लिए स्क्रीन कोड पर भरोसा करने के बजाय प्रिंट की तैयारी में रंग का मिलान करें। अलग-अलग डिस्प्ले पर एक ही कोड थोड़ा अलग दिख सकता है, क्योंकि सभी स्क्रीन एक समान कैलिब्रेट नहीं होती हैं। ऊपर बताए अनुसार HSL मान राउंडेड होते हैं, और जब तक “दोहराव न होने दें” को चुना न गया हो, किसी बैच में दोहराव की जाँच नहीं की जाती है। यह पेज जो गारंटी देता है वह स्पष्ट और सटीक है: इसके सभी 16,777,216 रंगों में से प्रत्येक, या आपके द्वारा निर्धारित सीमा के भीतर का प्रत्येक रंग, हर बार बटन दबाने पर समान संभावना रखता है, जो आपके ब्राउज़र के क्रिप्टोग्राफ़िक स्रोत से लिया जाता है और कभी कहीं नहीं भेजा जाता।