रंग-रूपांतरण
#f1f3f4
≈ Porcelain
बदलाव
इस अनुभाग का उद्देश्य आपके चयनित रंग के टिंट (शुद्ध सफेद मिलाया गया) और शेड (शुद्ध काला मिलाया गया) को 10% वृद्धि में सटीक रूप से तैयार करना है।
प्रो टिप: हॉवर स्थिति और छाया के लिए शेड्स का उपयोग करें, तथा हाइलाइट्स और पृष्ठभूमि के लिए टिंट्स का उपयोग करें।
रंगों
आपके आधार रंग में काला रंग मिलाकर गहरे रंग की विविधताएं बनाई जाती हैं।
टिंट करता
आपके आधार रंग में सफेद रंग मिलाकर हल्के बदलाव बनाए जाते हैं।
सामान्य उपयोग के मामले
- • UI घटक स्थितियाँ (हॉवर, सक्रिय, अक्षम)
- • छाया और हाइलाइट के साथ गहराई बनाना
- • सुसंगत रंग प्रणालियों का निर्माण
डिज़ाइन सिस्टम टिप
ये विविधताएँ एक सुसंगत रंग पैलेट का आधार बनती हैं। अपने पूरे प्रोजेक्ट में एकरूपता बनाए रखने के लिए इन्हें निर्यात करें।
रंग संयोजन
हर सामंजस्य का अपना एक अलग मूड होता है। सामंजस्य का इस्तेमाल करके ऐसे रंग संयोजनों पर विचार करें जो एक साथ अच्छे से काम करें।
का उपयोग कैसे करें
किसी भी रंग पर क्लिक करके उसका हेक्स मान कॉपी करें। ये संयोजन गणितीय रूप से दृश्य सामंजस्य बनाने में सिद्ध होते हैं।
यह क्यों मायने रखती है
रंगों का सामंजस्य आपके डिजाइनों में संतुलन पैदा करता है और विशिष्ट भावनाएं उत्पन्न करता है।
पूरक
रंग चक्र पर एक रंग और उसका विपरीत, +180 डिग्री का रंग। उच्च कंट्रास्ट।
विभाजित-पूरक
एक रंग और उसके पूरक के दो आसन्न रंग, मुख्य रंग के विपरीत मान से +/-30 डिग्री की रंगत। सीधे पूरक की तरह बोल्ड, लेकिन ज़्यादा बहुमुखी।
त्रिआधारी
रंग चक्र पर तीन रंग समान रूप से फैले हुए हैं, प्रत्येक रंग में 120 डिग्री का अंतर है। एक रंग को हावी होने देना और बाकी रंगों को आकर्षक रंगों के रूप में इस्तेमाल करना सबसे अच्छा है।
अनुरूप
समान चमक और संतृप्ति वाले तीन रंग, जिनके रंग चक्र पर एक-दूसरे से सटे हुए हैं, 30 डिग्री की दूरी पर। सहज संक्रमण।
एकरंगा
एक ही रंग के तीन रंग, चमक मान +/-50%। सूक्ष्म और परिष्कृत।
टेट्राडिक
पूरक रंगों के दो सेट, 60 डिग्री के अंतर से अलग।
रंग सिद्धांत के सिद्धांत
संतुलन
एक प्रमुख रंग का प्रयोग करें, द्वितीयक रंग से समर्थन करें, तथा संयम से उच्चारण करें।
अंतर
पठनीयता और सुगमता के लिए पर्याप्त कंट्रास्ट सुनिश्चित करें।
सद्भाव
रंगों को एक साथ मिलकर एकीकृत दृश्य अनुभव का सृजन करना चाहिए।
रंग कंट्रास्ट चेकर
यह सुनिश्चित करने के लिए रंग संयोजनों का परीक्षण करें कि वे पाठ पठनीयता के लिए WCAG सुगम्यता मानकों को पूरा करते हैं।
टेक्स्ट का रंग
बैकग्राउंड का रंग
कंट्रास्ट
WCAG मानक
उन्नत कंट्रास्ट परीक्षक
स्लाइडर्स, एकाधिक पूर्वावलोकन और अधिक के साथ फ़ाइन-ट्यून करें
हर कोई प्रतिभाशाली है। लेकिन अगर आप किसी मछली को उसके पेड़ पर चढ़ने की क्षमता के आधार पर आंकेंगे, तो वह जीवन भर यह मानकर जीएगी कि वह मूर्ख है।