Material Design पैलेट जनरेटर

एक बेस रंग चुनें और उसके दस शेड तुरंत पाएँ, सबसे हल्के (50) से सबसे गहरे (900) तक, Material Design द्वारा लोकप्रिय बनाए गए टोनल पैलेट की शैली में। गणना पूरी तरह आपके ब्राउज़र में होती है।

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

टूल आपके बेस रंग को शेड 500 मानता है, फिर उसमें धीरे-धीरे सफ़ेद मिलाकर हल्के शेड (50 से 400) और काला मिलाकर गहरे शेड (600 से 900) निकालता है; 500 से जितनी दूरी बढ़ती है, मिलावट का अनुपात उतना बढ़ता है। नतीजा एक सुसंगत टोनल पैलेट होता है, जो किसी डिज़ाइन सिस्टम या कॉम्पोनेंट गाइडलाइन में इस्तेमाल के लिए तैयार है।

क्या यह Material Design का आधिकारिक एल्गोरिदम ही है?

नहीं, Google अपने आधिकारिक पैलेट एक प्रोप्राइटरी एल्गोरिदम से बनाता है, जो ज़्यादा जटिल HCT कलर स्पेस पर आधारित है। यह टूल सफ़ेद और काले की ओर लीनियर मिश्रण से एक अनुमानित नतीजा देता है, जो दिखने में करीब है और सीधे इस्तेमाल हो सकता है, पर आधिकारिक Material पैलेट को पिक्सल-दर-पिक्सल दोहराने का दावा नहीं करता।

इस पैलेट को अपने प्रोजेक्ट में कैसे इस्तेमाल करूँ?

किसी शेड पर क्लिक करके उसका HEX कोड कॉपी करें, फिर उसे CSS वेरिएबल या डिज़ाइन टोकन (जैसे --primary-500) की तरह इस्तेमाल करें: हल्के शेड अक्सर बैकग्राउंड और निष्क्रिय अवस्थाओं के लिए, शेड 500 मुख्य रंग के लिए, और गहरे शेड टेक्स्ट या ज़्यादा कंट्रास्ट वाली सक्रिय अवस्थाओं के लिए काम आते हैं।

रंगों की सारी गणना सीधे आपके ब्राउज़र में होती है, किसी बाहरी सर्वर को कोई कॉल नहीं जाती।