🔧Toolify

CSS कलर नेम फाइंडर — हेक्स से सबसे नज़दीकी नामित रंग

हेक्स रंग कोड दर्ज करें या रंग चयनकर्ता का उपयोग करके सबसे नज़दीकी CSS4 नामित रंग खोजें। यह टूल आपके रंग की तुलना सभी 148 मानक CSS नामित रंगों से अवधारणात्मक रंग दूरी का उपयोग करके करता है और 5 सबसे नज़दीकी को रैंक करता है। कोड और दस्तावेज़ीकरण के लिए पठनीय रंग नाम खोजने के लिए उपयुक्त।

5 सबसे नज़दीकी CSS नामित रंग:

dodgerblue#1E90FF
Δ 53
royalblue#4169E1
Δ 62
cornflowerblue#6495ED
Δ 74
steelblue#4682B4
Δ 111
mediumslateblue#7B68EE
Δ 112

कैसे काम करता है

CSS नामित रंगों का संक्षिप्त इतिहास

CSS नामित रंग कई विनिर्देशन संस्करणों के माध्यम से विकसित हुए हैं। मूल CSS 1 (1996) ने केवल 16 बुनियादी रंग परिभाषित किए थे: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white और yellow। CSS 2 ने orange जोड़ा। CSS 3 ने X11 रंग सूची के आधार पर सूची को 147 रंगों तक विस्तारित किया, जो 1980 के दशक में MIT पर X Window सिस्टम रंग डेटाबेस से उत्पन्न हुई थी।

CSS Color Level 4 ने एक और नाम जोड़ा: rebeccapurple (#663399)। यह रंग Rebecca Alissa Meyer को सम्मानित करने के लिए जोड़ा गया था, जो वेब डेवलपर Eric Meyer की बेटी थीं, जिनकी 2014 में 6 साल की उम्र में मस्तिष्क कैंसर से मृत्यु हो गई थी। उनका पसंदीदा रंग बैंगनी था, और CSS वर्किंग ग्रुप ने उनके नाम को स्मारक के रूप में मानक में शामिल करने के लिए मतदान किया। इस जोड़ के साथ, CSS4 विनिर्देशन ठीक 148 नामित रंग परिभाषित करता है, जिसे यह टूल खोजता है।

रंग दूरी की गणना कैसे की जाती है

यूक्लिडियन दूरी के साथ RGB मानों की तुलना मानव धारणा के साथ अच्छी तरह मेल नहीं खाती: हमारी आंखें नीले की तुलना में हरे में अंतर के प्रति अधिक संवेदनशील हैं, और संवेदनशीलता चमक की सीमा में बदलती है। यह टूल Thiadmer Riemersma के 'Colour metric' पर आधारित भारित यूक्लिडियन सूत्र का उपयोग करता है, जो औसत लाल मान के आधार पर R, G और B चैनलों के भार को समायोजित करता है। परिणाम मानवों द्वारा रंग अंतर को वास्तव में कैसे देखा जाता है, उसके बहुत करीब है।

सूत्र है: ΔE = √[(2 + R̄/256)·ΔR² + 4·ΔG² + (2 + (255-R̄)/256)·ΔB²], जहाँ R̄ दो रंगों का औसत लाल घटक है। यह एक सरलीकृत अवधारणात्मक मीट्रिक है। पेशेवर रंग विज्ञान CIELAB ΔE गणनाओं का उपयोग करता है जो प्रकाश, क्रोमा और ह्यू को अलग से ध्यान में रखते हैं, लेकिन व्यावहारिक नामकरण उद्देश्यों के लिए सरलीकृत मीट्रिक अधिकांश रंगों के लिए सहज परिणाम देता है।

CSS में नामित रंगों का उपयोग कब करें

नामित रंग त्वरित प्रोटोटाइपिंग, कोड पठनीयता और डिबगिंग के लिए सबसे उपयोगी हैं। `color: tomato` लिखना `color: #FF6347` से तेज़ टाइप करना और याद रखना आसान है। ये शैक्षिक संदर्भों, डेटा विज़ुअलाइज़ेशन (जहाँ एक सिमेंटिक नाम अर्थ संचारित करने में मदद करता है) और डिज़ाइन सिस्टम में भी उपयोगी हैं जहाँ नामित रंगों का एक सीमित सेट पैलेट बनाता है। W3C पठनीयता में सुधार के लिए उदाहरणों और ट्यूटोरियल में नामित रंगों का उपयोग करने की अनुशंसा करता है।

उत्पादन डिज़ाइन सिस्टम के लिए, नामित रंग शायद ही कभी प्राथमिक पैलेट होते हैं: कस्टम हेक्स मान, HSL या डिज़ाइन टोकन नाम पसंद किए जाते हैं। हालाँकि, कस्टम मान के सबसे नज़दीकी नामित रंग को जानना दस्तावेज़ीकरण, कोड समीक्षाओं में रंग टिप्पणी और जब आप मौखिक रूप से रंग के बारे में संवाद करने के लिए त्वरित अनुमानित नाम चाहते हैं तो उपयोगी है। यह टूल किसी भी मनमाने हेक्स रंग का सबसे अच्छा वर्णन करने वाला CSS नाम खोजकर अंतर को पाटता है।

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

CSS में कितने नामित रंग हैं?

CSS Color Level 4 में 148 नामित रंग हैं। इसमें CSS 1 के मूल 16 बुनियादी रंग, CSS 2 से orange, CSS 3 से 130 X11-आधारित रंग और Rebecca Meyer को सम्मानित करने के लिए CSS 4 में जोड़ा गया rebeccapurple शामिल हैं। ध्यान दें कि aqua और cyan उपनाम हैं (एक ही हेक्स #00FFFF), जैसे fuchsia और magenta (#FF00FF)।

क्या CSS रंग नाम केस-सेंसिटिव हैं?

नहीं। CSS रंग नाम विनिर्देशन के अनुसार केस-असंवेदनशील हैं। 'Red', 'RED', 'red', और 'rEd' सभी एक ही रंग को संदर्भित करते हैं। परंपरागत रूप से, आधुनिक CSS में लोअरकेस सबसे सामान्य शैली है।

rebeccapurple क्या है?

rebeccapurple (#663399) को CSS Color Level 4 में Rebecca Alissa Meyer की स्मृति में जोड़ा गया था, जो CSS विशेषज्ञ Eric Meyer की बेटी थीं, जिनकी 2014 में 6 साल की उम्र में मस्तिष्क कैंसर से मृत्यु हो गई। उनका पसंदीदा रंग बैंगनी था, और CSS वर्किंग ग्रुप ने उसके नाम पर रंग का नामकरण करके उन्हें अमर किया। यह CSS 4 में जोड़ा गया एकमात्र रंग था और CSS 2 के बाद पहला नया नामित रंग था।

CSS नामित रंग सभी संभावित रंगों को क्यों कवर नहीं करते?

148 नामित रंग ऐतिहासिक X11 रंग सूचियों पर आधारित एक क्यूरेटेड सेट हैं। वे सामान्य ह्यू को कवर करते हैं लेकिन कई रंगों को बिना नाम के छोड़ते हैं: नीले-हरे, गुलाबी-नारंगी या भूरे-लाल के अधिकांश शेड्स के लिए कोई CSS नाम नहीं है। सटीक डिज़ाइन कार्य के लिए हेक्स कोड, rgb() या hsl() का उपयोग किया जाता है।

CSS में gray और grey में क्या अंतर है?

दोनों वर्तनी CSS में स्वीकार की जाती हैं। 'gray' विनिर्देशन में आधिकारिक अमेरिकी अंग्रेजी वर्तनी है, लेकिन 'grey' (ब्रिटिश अंग्रेजी) भी एक ही रंग (#808080) के लिए एक मान्य पर्यायवाची है। इसी तरह, 'lightgray'/'lightgrey', 'darkgray'/'darkgrey', 'dimgray'/'dimgrey', 'slategray'/'slategrey', और 'darkslategray'/'darkslategrey' सभी मान्य हैं।

सबसे नज़दीकी रंग मिलान कितना सटीक है?

मिलान एक अवधारणात्मक दूरी सूत्र का उपयोग करता है जो मानव आंख संवेदनशीलता द्वारा RGB चैनलों को भारित करता है। अधिकांश रोजमर्रा के रंगों के लिए — संतृप्त लाल, नीले, हरे — सबसे नज़दीकी नामित रंग सहज रूप से सही लगेगा। बहुत मंद, गहरे या भूरे रंगों के लिए, मानव धारणा अधिक परिवर्तनशील है और 'सबसे नज़दीकी' नामित रंग व्यक्तिपरक रूप से गलत लग सकता है। दिखाया गया दूरी स्कोर (Δ) आपको मिलान की निकटता का आकलन करने में मदद करता है — छोटा बेहतर है।

क्या मैं alt टेक्स्ट के लिए सुलभ रंग नाम खोजने के लिए इसका उपयोग कर सकता हूँ?

हाँ। यह टूल alt टेक्स्ट, दस्तावेज़ीकरण या डिज़ाइन टिप्पणी में रंग नाम लिखने के लिए उपयोगी है। यदि आपको किसी ऐसे पाठक को UI तत्व का रंग बताना है जो इसे देख नहीं सकता, तो सबसे नज़दीकी CSS नामित रंग एक व्यापक रूप से पहचाने जाने योग्य नाम प्रदान करता है। अत्यधिक विशिष्ट शेड्स के लिए, CSS नाम को एक संशोधक के साथ जोड़ें (जैसे #008080 के लिए 'गहरा टील')।

कौन से हेक्स रंगों में CSS नाम के साथ सटीक मिलान हैं?

148 मानक CSS नामित रंगों में से कोई भी सटीक मिलान उत्पन्न करेगा। सामान्य उदाहरण: red = #FF0000, blue = #0000FF, white = #FFFFFF, black = #000000, coral = #FF7F50, tomato = #FF6347, skyblue = #87CEEB। आप कोई भी हेक्स दर्ज करके और 'सटीक मिलान' संदेश देखकर जाँच सकते हैं।

संबंधित टूल्स

अंतिम अपडेट:

हमारे AI प्रॉम्प्ट आज़माएं →