टिंट और शेड जेनरेटर

इस टूल के बारे में

टिंट और शेड जेनरेटर किसी भी आधार रंग से हल्के और गहरे वेरिएंट बनाता है। टिंट आधार रंग को सफेद के साथ मिलाकर (चमक जोड़कर) बनाए जाते हैं, जबकि शेड काले के साथ मिलाकर (चमक घटाकर) बनाए जाते हैं।

यह टूल 5 टिंट स्तरों और 5 शेड स्तरों तक बनाता है, साथ ही मूल आधार रंग भी, जो आपको चुने हुए रंग के आसपास 11-चरण का पैलेट देता है। किसी भी स्वैच पर क्लिक करके उसका हेक्स कोड कॉपी किया जा सकता है।

कैसे उपयोग करें

1. कलर पिकर का उपयोग करके आधार रंग चुनें या हेक्स कोड टाइप करें।
2. प्रीसेट रंगों को जल्दी आज़माने के लिए सैंपल बटन का उपयोग करें।
3. पैलेट की चौड़ाई नियंत्रित करने के लिए स्तरों की संख्या (3-5) समायोजित करें।
4. किसी भी स्वैच पर क्लिक करके उसका हेक्स कोड कॉपी करें। पूरी स्केल के लिए सभी कॉपी करें का उपयोग करें।

उपयोग के मामले

डिज़ाइन सिस्टम को प्रत्येक ब्रांड रंग के लिए व्यवस्थित रंग स्केल की आवश्यकता होती है। UI डिज़ाइनर एकल एक्शन रंग से होवर, सक्रिय और अक्षम स्थितियां बनाते हैं। फ्रंटएंड डेवलपर्स सुसंगत रंग वेरिएंट बनाते हैं।

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

• टिंट और शेड में क्या अंतर है? — टिंट रंग को सफेद के साथ मिलाता है (हल्का); शेड काले के साथ मिलाता है (गहरा)। टोन ग्रे के साथ मिलाता है और यहाँ नहीं बनाया जाता।
• स्तर कैसे गणना किए जाते हैं? — प्रत्येक स्तर आधार रंग को 10%, 30%, 50%, 70% और 90% अनुपात में सफेद या काले के साथ मिलाता है, जो सुसंगत दृश्य चरण देता है।
• क्या मैं इससे CSS वेरिएबल प्राप्त कर सकता हूँ? — आउटपुट हेक्स कोड हैं। आप उन्हें अपने CSS में --color-500, --color-400 आदि के रूप में पेस्ट कर सकते हैं।