किसी भी 5-रंग पैलेट को तीन वास्तविक इंटरफेस में ड्रॉप करें — डैशबोर्ड, लैंडिंग पेज, मोबाइल ऐप — और इसे वास्तविक उत्पाद के रूप में देखें। भूमिकाएँ स्वचालित रूप से असाइन की जाती हैं: प्राइमरी, एक्सेंट, सरफेस और टेक्स्ट सभी अपना स्थान पाते हैं।
पैलेट संपादित करें (स्वैच को बदलने के लिए क्लिक करें)
तीन वास्तविक इंटरफेस में डाले गए पांच रंग, स्वचालित रूप से भूमिकाएं असाइन की जाती हैं।
किसी भी सामुदायिक पैलेट या पैलेट बोर्ड पर "Visualize" पर क्लिक करें ताकि उसे लोड किया जा सके, या पांच HEX मानों को मैन्युअल रूप से संपादित करें।
इंजीन प्राथमिक, द्वितीयक, एक्सेंट, सरफेस और टेक्स्ट को लाइटनेस और क्रोमा के आधार पर असाइन करता है - देखें कि प्रत्येक मॉकअप में प्रत्येक रोल कहां आता है।
डैशबोर्ड, लैंडिंग पेज और मोबाइल ऐप के बीच वास्तविक समय में स्विच करें; किसी भी स्वैच पर क्लिक करके मौके पर ही किसी रंग को बदलें।
चार प्रश्न जो लोग वास्तव में पैलेट प्रीव्यू के बारे में पूछते हैं।
यहां से आगे बढ़ें और रंगों को काम में लाएं।
स्पेसबार से रैंडमाइज़ करें, लॉक करें, पुनः क्रमबद्ध करने के लिए ड्रैग करें, URL से साझा करें - वह सब कुछ जो एक पैलेट बोर्ड को करना चाहिए।
किसी भी रंग को 11-चरणीय डिज़ाइन-सिस्टम स्केल में बदलें, OKLCH में अवधारणात्मक रूप से समान, प्रत्येक चरण में WCAG कंट्रास्ट, Tailwind/CSS/SCSS/JSON में निर्यात करें।
WCAG 2.1 किसी भी अग्रभूमि और पृष्ठभूमि रंग के बीच कंट्रास्ट सत्यापन।
एक पंक्ति में किसी दृश्य या मूड का वर्णन करें - तर्क के साथ पांच-भूमिका वाला पैलेट प्राप्त करें।