कॉम्प्लिमेंट्री कलर पैलेट
एक बेस कलर चुनें: उसका कॉम्प्लिमेंट्री रंग (कलर व्हील पर 180° विपरीत) अपने-आप निकाल लिया जाता है, साथ ही दोनों रंगों के हल्के और गहरे शेड भी मिलते हैं। प्रोसेसिंग 100% लोकल, आपके ब्राउज़र में — सर्वर पर कुछ नहीं भेजा जाता।
यह कैसे काम करता है
कलर व्हील पर कॉम्प्लिमेंट्री रंग वह होता है जो बेस कलर के ठीक सामने (ह्यू में 180° के अंतर पर) स्थित हो। साथ रखने पर ये दोनों रंग तीखा विज़ुअल कंट्रास्ट बनाते हैं, जिसका डिज़ाइन में खूब इस्तेमाल होता है, ताकि किसी एक्शन बटन, लोगो या मुख्य एलिमेंट को विपरीत रंग की पृष्ठभूमि पर उभारा जा सके। यह टूल सटीक कॉम्प्लिमेंट्री रंग निकालता है और फिर हर रंग का एक गहरा और एक हल्का संस्करण बनाता है, ताकि आपको सीधे इस्तेमाल लायक एक छोटा पैलेट मिल जाए।
करीबी रंगों के पैलेट की जगह कॉम्प्लिमेंट्री पैलेट क्यों इस्तेमाल करें?
करीबी (एनालॉगस) रंगों का पैलेट सामंजस्यपूर्ण और संयत माहौल देता है, जबकि कॉम्प्लिमेंट्री पैलेट जानबूझकर विज़ुअल तनाव पैदा करता है और नज़र खींचता है। यह कॉल-टू-एक्शन बटन, नोटिफ़िकेशन बैज या किसी भी ऐसे एलिमेंट के लिए बढ़िया है जिसे बाकी इंटरफ़ेस से साफ़ अलग दिखना चाहिए।
बनाए गए हल्के और गहरे शेड का इस्तेमाल कैसे करें?
गहरे शेड टेक्स्ट और “होवर”/“एक्टिव” स्थितियों के लिए अच्छे रहते हैं, जबकि हल्के शेड सेक्शन की पृष्ठभूमि, डिसेबल्ड स्थितियों या हल्के बैज के लिए काम आते हैं, और ये मुख्य रंग या उसके कॉम्प्लिमेंट्री रंग की ही रंग-श्रेणी में रहते हैं।
रंगों की पूरी गणना (HEX/HSL रूपांतरण, ह्यू रोटेशन) JavaScript में, सीधे आपके ब्राउज़र में लोकल रूप से चलती है।