ऑनलाइन रंग कैसे चुनें और मुफ़्त में HEX और RGB कोड पाएँ (2026 गाइड)
आपने एकदम सही शेड देखा है — किसी वेबसाइट पर, किसी लोगो में, किसी डिज़ाइन मॉकअप में — और अब उसे खुद उपयोग करने के लिए उसका सटीक कोड चाहिए। अनुमान लगाने से आप करीब तो पहुँचते हैं लेकिन कभी सटीक नहीं, और ब्रांड रंग न मिलने पर "करीब" भी नज़र आता है। एक कलर पिकर इसे सेकंडों में सुलझा देता है: रंग को दृश्य रूप से चुनें और उसके सटीक HEX और RGB मान तुरंत पाएँ। यह गाइड आपको दिखाती है कि हमारे मुफ़्त कलर पिकर का उपयोग कैसे करें और कोड मिलने के बाद उनके साथ क्या करें।
मुफ़्त कलर पिकर क्या करता है
कलर पिकर आपको किसी भी रंग को दृश्य रूप से चुनने देता है और तुरंत उसका HEX कोड (जैसे #3B82F6) और RGB मान (जैसे rgb(59, 130, 246)) दिखाता है। ये दो प्रारूप हैं जिनसे आप वेब डिज़ाइन और डेवलपमेंट में सबसे अधिक मिलेंगे। सब कुछ आपके ब्राउज़र में चलता है — बिना साइन-अप, बिना इंस्टॉल, असीमित उपयोग।
HEX बनाम RGB: 30 सेकंड की व्याख्या
दोनों प्रारूप ठीक एक ही रंग का वर्णन करते हैं; बस उसे अलग तरह से लिखते हैं। HEX एक छह-अंकीय कोड है (# के बाद) जिसमें अंकों की हर जोड़ी हेक्साडेसिमल में लाल, हरे और नीले घटकों को दर्शाती है — #FF0000 शुद्ध लाल है। RGB उन्हीं तीन घटकों को 0 से 255 तक दशमलव संख्याओं के रूप में लिखता है — rgb(255, 0, 0) वही शुद्ध लाल है।
कौन सा उपयोग करें? CSS और ज़्यादातर वेब काम के लिए HEX सामान्य डिफ़ॉल्ट है। RGB तब उपयोगी होता है जब आपको पारदर्शिता चाहिए — rgba(59, 130, 246, 0.5) वही नीला 50% अपारदर्शिता पर है, जिसे HEX अकेले व्यक्त नहीं कर सकता। पिकर दोनों देता है, इसलिए आप किसी भी तरह से तैयार हैं। बाद में उनके बीच बदलना हो तो? हमारा हेक्स टू आरजीबी कन्वर्टर किसी भी दिशा में अनुवाद करता है।
चरण-दर-चरण: रंग चुनें और उसके कोड पाएँ
- कलर पिकर खोलें। यह फ़ोन, टैबलेट और कंप्यूटर पर किसी भी आधुनिक ब्राउज़र में चलता है।
- अपना रंग चुनें। पिकर के दृश्य चयनकर्ता का उपयोग करके ठीक वह शेड तय करें जो आप चाहते हैं — ह्यू में घुमाएँ और तब तक समायोजित करें जब तक पूर्वावलोकन आपकी चाह से मेल न खाए।
- HEX और RGB मान पढ़ें। रंग समायोजित करते ही टूल दोनों प्रारूप तुरंत दिखाता है।
- जो मान चाहिए, उसे कॉपी करें। स्टाइलशीट और डिज़ाइन टूल के लिए HEX कोड लें, या जब अपारदर्शिता नियंत्रण चाहिए तो RGB मान लें।
- उसे सही जगह पेस्ट करें। कोड को अपनी CSS, डिज़ाइन ऐप के रंग फ़ील्ड, प्रेज़ेंटेशन थीम या ब्रांड दस्तावेज़ में डालें।
रोज़मर्रा की स्थितियाँ जहाँ कलर पिकर बचाता है
- ब्रांड रंग मिलाना: क्लाइंट कहता है "हमारा नीला उपयोग करें" लेकिन कोई कोड नहीं भेजता। उनके लोगो या वेबसाइट से नीला चुनें और सेकंडों में सटीक HEX मिल जाता है।
- स्टाइलशीट बनाना: अपने पैलेट को CSS वेरिएबल के रूप में परिभाषित करें (
--primary: #3B82F6;) और आपकी पूरी साइट सुसंगत रहती है। - डिज़ाइन हैंडऑफ़: जब मॉकअप और कोड की गई साइट अलग हो जाएँ, तो पिकर डिज़ाइनर और डेवलपर दोनों को हर रंग के लिए सत्य का एक स्रोत देता है।
- प्रेज़ेंटेशन थीम: डिफ़ॉल्ट पैलेट से अनुमान लगाने के बजाय अपनी कंपनी के सटीक रंग स्लाइड डेक में लाएँ।
- "लगभग सही" ठीक करना: दो तत्व जो मेल खाने चाहिए लेकिन नहीं खाते? दोनों रंग चुनें और कोड की तुलना करें — आप देखेंगे कि ठीक कौन सा घटक गलत है।
एक चुने रंग से पैलेट बनाना
एक रंग शायद ही कभी काफ़ी होता है — इसे पूरे पैलेट में बढ़ाने का तरीका यह है:
- कलर पिकर से अपना आधार रंग चुनें और उसका HEX कोड कॉपी करें।
- उसके शेड खोजें: होवर स्थिति, बॉर्डर और गहराई के लिए उसी ह्यू के गहरे संस्करण चुनें; पृष्ठभूमि और हल्के भराव के लिए हल्के संस्करण चुनें।
- एक एक्सेंट जोड़ें: रैंडम कलर पैलेट टूल से विकल्प बनाते रहें जब तक कोई ऐसा रंग न मिले जो आधार को टकराव के बिना ऊर्जावान बनाए।
- उन्हें मिलाएँ: ग्रेडिएंट जनरेटर में आधार और एक्सेंट को एक साथ पूर्वावलोकन करें — अगर वे सुखद रूप से मिलते हैं, तो लेआउट में भी खुशी से साथ रहेंगे।
- पठनीयता जाँचें: अपने टेक्स्ट/पृष्ठभूमि जोड़ों को कंट्रास्ट चेकर से गुज़ारें ताकि सुनिश्चित हो कि वास्तविक उपयोगकर्ता आपकी सामग्री वास्तव में पढ़ सकें।
रंग अच्छी तरह चुनने के सुझाव
- उस स्क्रीन पर चुनें जहाँ रंग रहेगा। फ़ोन और डेस्कटॉप डिस्प्ले के बीच रंग बदलते हैं। अगर रंग मोबाइल ऐप के लिए है, तो अंतिम चयन फ़ोन पर करें।
- अलग-थलग नहीं, संदर्भ में परखें। अकेले परफ़ेक्ट दिखने वाला स्वैच आपकी वास्तविक सामग्री के बगल में गलत लग सकता है। कोड को जल्दी किसी वास्तविक ड्राफ़्ट में पेस्ट करें।
- कोड लिखकर रखें। एक छोटा पैलेट दस्तावेज़ रखें — पाँच HEX कोड वाली नोट्स फ़ाइल भी — ताकि हर भावी संपत्ति मेल खाए। "होमपेज वाला नीला" कोई विशिष्टता नहीं है;
#3B82F6है। - पृष्ठभूमि का ध्यान रखें: सफ़ेद बनाम गहरी पृष्ठभूमि पर एक ही रंग अलग दिखता है (एक साथ विरोधाभास)। हमेशा रंग को उसी पृष्ठभूमि के विरुद्ध आँकें जिस पर वह बैठेगा।
- अपना पैलेट सीमित रखें। ज़्यादातर परियोजनाओं के लिए तीन से पाँच रंग पर्याप्त हैं। अधिक रंग आमतौर पर कम सामंजस्य का अर्थ है, अधिक रचनात्मकता का नहीं।
अक्सर पूछे जाने वाले प्रश्न
क्या कलर पिकर मुफ़्त है?
हाँ — तुरंत HEX और RGB मानों के साथ असीमित रंग चयन, बिना साइन-अप।
HEX और RGB में क्या अंतर है?
वे एक ही रंग को अलग अंकन में वर्णित करते हैं। HEX (#3B82F6) संक्षिप्त है और CSS में मानक है; RGB (rgb(59, 130, 246)) लाल/हरे/नीले घटकों को 0–255 संख्याओं के रूप में सूचीबद्ध करता है और RGBA के माध्यम से पारदर्शिता के लिए अल्फ़ा चैनल का समर्थन करता है।
क्या मैं अपने पास मौजूद HEX कोड को RGB में बदल सकता हूँ?
हाँ — किसी भी दिशा में तुरंत अनुवाद के लिए उसे हमारे हेक्स टू आरजीबी कन्वर्टर में पेस्ट करें।
क्या रंग हर जगह एक जैसा दिखेगा?
बहुत करीब, लेकिन पिक्सेल-समान नहीं: हर स्क्रीन थोड़ी अलग कैलिब्रेट होती है। महत्वपूर्ण ब्रांड काम के लिए, अपने दर्शकों द्वारा उपयोग किए जाने वाले वास्तविक डिवाइस पर सत्यापित करें।
अभी अपना रंग चुनें: मुफ़्त कलर पिकर · मुफ़्त हेक्स टू आरजीबी कन्वर्टर · मुफ़्त कंट्रास्ट चेकर