टूल कलेक्शन

कलर, ऐक्सेसिबिलिटी और CSS स्टूडियो

रंग-कंट्रास्ट तुलना करें, ग्रैडिएंट व शैडो बनाएँ, फिर Grid, Flexbox या फ़्लुइड लेआउट बनाएँ। कंट्रास्ट जाँच के नतीजे चुने हुए स्टैंडर्ड पर निर्भर करते हैं और पूरे ऐक्सेसिबिलिटी ऑडिट के विकल्प नहीं हैं।

रंग पहचानने, कंट्रास्ट जाँचने और ग्रैडिएंट, शैडो व CSS लेआउट बनाने के स्टूडियो।

इस कलेक्शन के टूल

4 टूल

कलर और CSS डिज़ाइन

कलर, पैलेट और कंट्रास्ट स्टूडियो

कलर मॉडल कन्वर्ट करें, CSS स्केल बनाएँ, पैलेट निकालें और WCAG या APCA कंट्रास्ट जाँचें।

टूल खोलें

कलर और CSS डिज़ाइन

ग्रैडिएंट, शैडो और CSS एनिमेशन स्टूडियो

प्रीव्यू के साथ ग्रैडिएंट, शैडो, फ़िल्टर, ट्रांसफ़ॉर्म और CSS एनिमेशन बनाएँ।

टूल खोलें

कलर और CSS डिज़ाइन

CSS Grid, Flexbox और फ़्लुइड टाइपोग्राफ़ी स्टूडियो

CSS ग्रिड, Flexbox लेआउट, फ़्लुइड टाइप और रिस्पॉन्सिव स्पेसिंग प्रोटोटाइप करें।

टूल खोलें

इमेज और वेक्टर ग्राफ़िक्स

SVG और वेक्टर आइकन स्टूडियो

SVG कोड, viewBox और रंग एडिट करें, पाथ ऑप्टिमाइज़ करें, फिर TSX/JSX, CSS Data URI, PNG या WebP में एक्सपोर्ट करें।

टूल खोलें

शामिल श्रेणियाँ

डिज़ाइन और CSS टूल पर सवाल

क्या कलर स्टूडियो WCAG और APCA कंट्रास्ट जाँचता है?

कलर स्टूडियो के फ़ॉर्म में उपलब्ध विधियाँ और माप बताए गए हैं। चुना गया मोड जाँचें और उपयोग प्रसंग के अनुसार नतीजा समझें।

कंट्रास्ट जाँच स्वयं पर्याप्त है?

नहीं। कंट्रास्ट गणना टेक्स्ट, बटन और ठोस बैकग्राउंड को कवर करती है; इमेज के ऊपर लिखा टेक्स्ट, ग्रैडिएंट बैकग्राउंड और जटिल ग्राफ़िक्स नहीं। इसलिए इसे शुरुआती जाँच मानें, पूरे ऐक्सेसिबिलिटी ऑडिट का विकल्प नहीं।

जनरेट की गई CSS को सीधे प्रोजेक्ट में रख सकते हैं?

हाँ, पर पढ़े-समझे बिना एक्सपोर्ट न करें: नमूनों को अपने कोड कन्वेंशन के अनुसार एडिट करें, टारगेट ब्राउज़र/डिवाइस में संगति जाँचें और असली प्रीव्यू देखें।

प्रीव्यू सचमुच भरोसा में होता है?

प्रीव्यू जाँचने में मदद करता है, गारंटी नहीं देता। फ़ॉन्ट, स्पेसिंग और डिस्प्ले अक्सर अपने असली प्रसंग में अलग रेंडर होते हैं; अंतिम रेंडरिंग वहीं दोबारा जाँचें।

काम के प्रकार से टूल देखें।

सभी टूल देखें
☕ हमारा समर्थन करें