CSS कलर कन्वर्टर
लाइव स्वैच के साथ HEX, RGB और HSL के बीच कन्वर्ट करें।
आपके द्वारा दर्ज हर रंग आपके browser में स्थानीय रूप से बदला जाता है, और कुछ भी किसी सर्वर पर अपलोड नहीं होता।
पठनीयता जाँच रहे हैं? Contrast Checker आज़माएँ।
CSS कलर कन्वर्टर के बारे में
यह CSS color कन्वर्टर किसी भी रंग मान को एक साथ HEX, RGB, और HSL में बदल देता है, साथ ही एक लाइव स्वैच प्रीव्यू के साथ ताकि आप टाइप करते ही सटीक शेड देख सकें। एक hex कोड, एक rgb() या hsl() मान, या blue, teal, या gold जैसा सामान्य CSS रंग नाम पेस्ट करें, और यह तुरंत इनपुट को तीनों फ़ॉर्मैट में सामान्यीकृत कर देता है। यह transparency भी संभालता है, जिसमें rgba(), hsla(), और alpha चैनल वाला 8-अंकीय hex शामिल है। चाहे आप किसी design token के लिए hex से rgb की गणना कर रहे हों, किसी stylesheet के लिए rgb को hex में बदल रहे हों, या किसी palette को ट्यून करते समय किसी hsl मान की जाँच कर रहे हों, यह हर फ़ॉर्मैट को सिंक में रखता है। हर दिन रंग फ़ॉर्मैट के साथ जूझने वाले फ्रंट-एंड डेवलपर्स, डिज़ाइनरों, और QA इंजीनियरों के लिए बनाया गया। सब कुछ आपके browser में स्थानीय रूप से चलता है, इसलिए आपके द्वारा दर्ज मान आपके डिवाइस से बाहर नहीं जाते।
विशेषताएँ
- एक ही इनपुट से HEX, RGB, और HSL को एक साथ बदलता है
- blue, teal, और gold जैसे सामान्य CSS रंग नामों को पहचानता है
- rgba(), hsla(), और 8-अंकीय hex alpha के ज़रिए transparency को सपोर्ट करता है
- लाइव रंग स्वैच प्रीव्यू टाइप करते ही तुरंत अपडेट होता है
- shorthand 3- और 4-अंकीय hex कोड स्वीकार करता है
- प्रतिशत और 0-255 RGB चैनल मानों को सामान्यीकृत करता है
- जब कोई मान parse नहीं हो पाता तो एक स्पष्ट इनलाइन त्रुटि दिखाता है
- आपके browser में स्थानीय रूप से प्रोसेस किया गया
CSS कलर कन्वर्टर का उपयोग कैसे करें
- Color इनपुट बॉक्स में एक रंग टाइप या पेस्ट करें।
- एक hex कोड, rgb(), hsl(), या blue जैसा CSS रंग नाम उपयोग करें।
- परिणाम पंक्तियों में परिवर्तित HEX, RGB, और HSL मान पढ़ें।
- सटीक रंग का प्रीव्यू देखने के लिए इनपुट के बगल वाले स्वैच की जाँच करें।
उदाहरण
इनपुट
#3b82f6
आउटपुट
HEX #3b82f6
RGB rgb(59, 130, 246)
HSL hsl(217, 91%, 60%)
एक hex मान को RGB और HSL में बदला गया, साथ में मिलता-जुलता लाइव स्वैच।
सामान्य त्रुटियाँ और समस्या निवारण
- मान टाइप करने के बाद "Couldn't parse that color" दिखता है। — एक मान्य hex कोड, rgb()/rgba(), hsl()/hsla(), या सपोर्टेड CSS रंग नाम उपयोग करें; भटके हुए अक्षर या गायब कोष्ठक parsing को तोड़ देते हैं।
- "salmon" जैसा CSS रंग नाम पहचाना नहीं जाता। — केवल सामान्य नामों का एक चुना हुआ सेट सपोर्टेड है। इसके बजाय समतुल्य hex या rgb() मान दर्ज करें।
- बदलने के बाद alpha खो जाता है। — इनपुट में alpha चैनल शामिल करें, जैसे rgba(0,0,0,0.5) या #00000080 जैसा 8-अंकीय hex, और यह सभी फ़ॉर्मैट में आगे बढ़ेगा।
- 255 से अधिक RGB मान या प्रतिशत गलत दिखते हैं। — चैनल मान्य रेंज में clamp किए जाते हैं; अपेक्षित परिणाम पाने के लिए 0-255 के बीच संख्याएँ या 0%-100% के बीच प्रतिशत पास करें।
अक्सर पूछे जाने वाले प्रश्न
- CSS Color Converter क्या है?
- यह एक in-browser टूल है जो किसी भी HEX, rgb()/rgba(), hsl()/hsla(), या सामान्य CSS रंग नाम को पढ़ता है और इसे एक लाइव स्वैच प्रीव्यू के साथ HEX, RGB, और HSL में बदल देता है।
- इस टूल से मैं HEX को RGB और HSL में कैसे बदलूँ?
- Color बॉक्स में #3b82f6 जैसा एक hex कोड पेस्ट करें, और CSS Color Converter तुरंत परिणाम पंक्तियों में मिलते-जुलते rgb() और hsl() मान दिखाता है।
- क्या CSS Color Converter transparency और alpha चैनल को सपोर्ट करता है?
- हाँ। rgba(), hsla(), और alpha मान वाला 8-अंकीय hex सभी parse किए जाते हैं, और alpha हर आउटपुट फ़ॉर्मैट में सुरक्षित रखा जाता है।
- क्या मैं कोड के बजाय CSS रंग नाम पेस्ट कर सकता हूँ?
- हाँ, blue, teal, gold, और indigo जैसे मानक नाम पहचाने जाते हैं और HEX, RGB, और HSL में बदले जाते हैं।
- क्या यह shorthand hex कोड स्वीकार करता है?
- हाँ, #f00 या #f00a जैसे 3-अंकीय और 4-अंकीय shorthand hex रूपांतरण से पहले स्वचालित रूप से विस्तृत किए जाते हैं।
- क्या मेरे द्वारा दर्ज किए गए रंग मान कहीं अपलोड होते हैं?
- नहीं। CSS Color Converter पूरी तरह आपके browser में चलता है, इसलिए आपके द्वारा दर्ज मान स्थानीय रूप से प्रोसेस होते हैं और कभी आपके डिवाइस से बाहर नहीं जाते।
संबंधित टूल
- कंट्रास्ट चेकर — दो रंगों के बीच WCAG कंट्रास्ट अनुपात और AA/AAA पास होना जाँचें।
- CSS / SCSS फ़ॉर्मेटर — CSS/SCSS/LESS को सुंदर या छोटा बनाएँ, प्रॉपर्टी क्रमबद्ध करें और डुप्लिकेट हटाएँ।
- SVG ऑप्टिमाइज़र — SVG को छोटा करें: टिप्पणियाँ, मेटाडेटा और एडिटर अवशेष हटाएँ, और रिक्त स्थान संक्षिप्त करें।
- नंबर बेस कन्वर्टर — पूर्णांकों को बाइनरी, ऑक्टल, दशमलव और हेक्साडेसिमल के बीच कन्वर्ट करें।
- HTML एस्केप / अनएस्केप — HTML विशेष वर्णों और एंटिटीज़ को एस्केप और अनएस्केप करें।
- JS / TS फ़ॉर्मेटर — Prettier विकल्पों के साथ JavaScript, TypeScript और JSX/TSX को सुंदर या छोटा बनाएँ।
- HTML फ़ॉर्मेटर — HTML को सुंदर या छोटा बनाएँ, इनलाइन CSS/JS फ़ॉर्मेट करें और परिणाम का पूर्वावलोकन करें।
सभी ArrayKit टूल