सामग्री पर जाएं

डिज़ाइन एवं रंग गाइड

पूरी गाइड, उदाहरण और समस्या निवारण पढ़ने के लिए एक टूल चुनें।

CSS बॉक्स शैडो जेनरेटर — मार्गदर्शिका, उदाहरण और अक्सर पूछे जाने वाले प्रश्न

स्तरित बॉक्स छाया को दृश्य रूप से डिज़ाइन करें और उत्पादन के लिए तैयार CSS की प्रतिलिपि बनाएँ।

4 मिनट पढ़ा

CSS ग्रेडिएंट जेनरेटर — मार्गदर्शिका, उदाहरण और अक्सर पूछे जाने वाले प्रश्न

एकाधिक रंग स्टॉप के साथ रैखिक, रेडियल और शंकु ग्रेडिएंट बनाएं।

4 मिनट पढ़ा

बॉर्डर रेडियस जेनरेटर — मार्गदर्शिका, उदाहरण और अक्सर पूछे जाने वाले प्रश्न

प्रत्येक कोने को स्वतंत्र रूप से नियंत्रित करें और जैविक आकृतियों और गोलियों का पूर्वावलोकन करें।

4 मिनट पढ़ा

रंग परिवर्तक — मार्गदर्शिका, उदाहरण और अक्सर पूछे जाने वाले प्रश्न

लाइव नमूने और कंट्रास्ट संकेतों के साथ HEX, RGB, HSL और HSV के बीच कनवर्ट करें।

4 मिनट पढ़ा

WCAG कंट्रास्ट चेकर — मार्गदर्शिका, उदाहरण और अक्सर पूछे जाने वाले प्रश्न

टेक्स्ट कंट्रास्ट अनुपात को मापें और सामान्य और बड़े टेक्स्ट के लिए AA/AAA अनुपालन की जांच करें।

4 मिनट पढ़ा

PX से REM कनवर्टर — मार्गदर्शिका, उदाहरण और अक्सर पूछे जाने वाले प्रश्न

पिक्सेल को rem में कनवर्ट करें और कॉन्फ़िगर करने योग्य रूट फ़ॉन्ट आकार के साथ वापस करें।

4 मिनट पढ़ा

CSS फ्लेक्सबॉक्स जेनरेटर — मार्गदर्शिका, उदाहरण और अक्सर पूछे जाने वाले प्रश्न

दृश्य रूप से फ्लेक्सबॉक्स लेआउट बनाएं और CSS को कॉपी करें।

4 मिनट पढ़ा

CSS ग्रिड जेनरेटर — मार्गदर्शिका, उदाहरण और अक्सर पूछे जाने वाले प्रश्न

दृश्य रूप से उत्तरदायी CSS ग्रिड कॉलम, पंक्तियाँ और अंतराल बनाएँ।

4 मिनट पढ़ा

CSS त्रिभुज जेनरेटर — मार्गदर्शिका, उदाहरण और अक्सर पूछे जाने वाले प्रश्न

बॉर्डर ट्रिक से किसी भी दिशा में CSS त्रिकोण बनाएं।

4 मिनट पढ़ा

ग्लासमोर्फिज्म जेनरेटर — मार्गदर्शिका, उदाहरण और अक्सर पूछे जाने वाले प्रश्न

धुंधलेपन, रंगत, बॉर्डर और छाया के साथ फ्रॉस्टेड-ग्लास कार्ड बनाएं।

4 मिनट पढ़ा

कस्टम स्क्रॉलबार जेनरेटर — मार्गदर्शिका, उदाहरण और अक्सर पूछे जाने वाले प्रश्न

वेबकिट और फ़ायरफ़ॉक्स CSS गुणों के साथ स्टाइल स्क्रॉलबार।

4 मिनट पढ़ा

CSS एनिमेशन जेनरेटर — मार्गदर्शिका, उदाहरण और अक्सर पूछे जाने वाले प्रश्न

कॉन्फ़िगर करने योग्य समय के साथ एक फ़ेड-एंड-स्लाइड कीफ़्रेम एनीमेशन बनाएं।

4 मिनट पढ़ा

द्रव टाइपोग्राफी जेनरेटर — मार्गदर्शिका, उदाहरण और अक्सर पूछे जाने वाले प्रश्न

क्लैंप() फ़ॉन्ट आकार बनाएं जो व्यूपोर्ट के बीच आसानी से स्केल करें।

4 मिनट पढ़ा

CSS फ़िल्टर जेनरेटर — मार्गदर्शिका, उदाहरण और अक्सर पूछे जाने वाले प्रश्न

धुंधलापन, चमक, कंट्रास्ट, संतृप्ति और रंग फ़िल्टर को दृष्टिगत रूप से संयोजित करें।

4 मिनट पढ़ा

रंग पैलेट जेनरेटर — मार्गदर्शिका, उदाहरण और अक्सर पूछे जाने वाले प्रश्न

आधार रंग से पूरक, अनुरूप, त्रियादिक और टेट्राडिक पैलेट उत्पन्न करें।

4 मिनट पढ़ा

टिंट एवं शेड जेनरेटर — मार्गदर्शिका, उदाहरण और अक्सर पूछे जाने वाले प्रश्न

किसी भी आधार रंग से पांच टिंट और पांच शेड बनाएं।

4 मिनट पढ़ा

SVG तरंग जेनरेटर — मार्गदर्शिका, उदाहरण और अक्सर पूछे जाने वाले प्रश्न

सेक्शन डिवाइडर और पृष्ठभूमि के लिए सुचारू SVG तरंग पथ उत्पन्न करें।

4 मिनट पढ़ा

फॉन्ट पेयरिंग सैंडबॉक्स — मार्गदर्शिका, उदाहरण और अक्सर पूछे जाने वाले प्रश्न

सिस्टम फ़ॉन्ट का उपयोग करके शीर्षक और मुख्य फ़ॉन्ट युग्मन का पूर्वावलोकन करें।

4 मिनट पढ़ा

सिस्टम फॉन्ट स्टैक जेनरेटर — मार्गदर्शिका, उदाहरण और अक्सर पूछे जाने वाले प्रश्न

यूआई और गद्य के लिए तैयार सिस्टम फ़ॉन्ट स्टैक की प्रतिलिपि बनाएँ।

4 मिनट पढ़ा

CSS टेक्स्ट शैडो जेनरेटर — मार्गदर्शिका, उदाहरण और अक्सर पूछे जाने वाले प्रश्न

स्तरित टेक्स्ट छाया डिज़ाइन करें और CSS की प्रतिलिपि बनाएँ।

4 मिनट पढ़ा