Skip to main content

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

टेलविंड कॉन्फ़िग जनरेटर illustration
🎨

टेलविंड कॉन्फ़िग जनरेटर

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

1

ब्रांड रंग सेट करें

टेलविंड पैलेट को बढ़ाने के लिए प्राथमिक और माध्यमिक रंग चुनें।

2

फ़ॉन्ट्स और ब्रेकपॉइंट्स कॉन्फ़िगर करें

फ़ॉन्ट परिवार, बॉर्डर तीर, डार्क मोड रणनीति और स्क्रीन ब्रेकपॉइंट्स सेट करें।

3

कॉन्फ़िग की प्रतिलिपि बनाएं

आपके परियोजना में उपयोग करने के लिए तैयार tailwind.config.js की पूर्ण प्रतिलिपि बनाएं।

Loading tool...

What Is टेलविंड कॉन्फ़िग जनरेटर?

टेलविंड कॉन्फ़िग जनरेटर टेलविंड सीएसएस परियोजनाओं के लिए अनुकूलित tailwind.config.js फ़ाइलें बनाता है। टेलविंड कॉन्फ़िगरेशन यह नियंत्रित करता है कि फ़्रेमवर्क उपयोगिता वर्गों को कैसे उत्पन्न करता है - रंगों और फ़ॉन्ट्स से लेकर ब्रेकपॉइंट्स और डार्क मोड व्यवहार तक। यह टूल आपको प्राथमिक और द्वितीयक ब्रांड रंग निर्धारित करने, संस, सरिफ़ और मोनो स्टैक के लिए फ़ॉन्ट परिवारों का चयन करने, डिफ़ॉल्ट बॉर्डर त्रिज्या कॉन्फ़िगर करने, डार्क मोड रणनीति (क्लास या मीडिया) निर्धारित करने, वर्ग शुद्धिकरण के लिए सामग्री पथ सेट करने और प्रतिक्रियात्मक ब्रेकपॉइंट्स को अनुकूलित करने देता है। उत्पन्न कॉन्फ़िगरेशन फ़ाइल आधिकारिक टेलविंड कॉन्फ़िग प्रारूप का उपयोग करती है जिसमें मॉड्यूल.एक्सपोर्ट्स सyntax सही है, तैयार अपनी मौजूदा tailwind.config.js फ़ाइल को बदलने या विस्तारित करने के लिए।

Why Use टेलविंड कॉन्फ़िग जनरेटर?

  • ब्रांड रंग चयन के लिए दृश्य रंग चुनने वाले
  • कॉन्फ़िगरेबल फ़ॉन्ट स्टैक, ब्रेकपॉइंट्स और डार्क मोड
  • मानक टेलविंड कॉन्फ़िग प्रारूप सही वाक्य रचना के साथ
  • किसी भी टेलविंड सीएसएस परियोजना में उपयोग करने के लिए तैयार

Common Use Cases

नया प्रोजेक्ट सेटअप

नए टेलविंड प्रोजेक्ट्स स्थापित करते समय एक शुरुआती कॉन्फ़िगरेशन उत्पन्न करें।

ब्रांड अनुकूलन

कस्टम रंगों और फ़ॉन्ट्स के साथ ब्रांड-विशिष्ट टेलविंड कॉन्फ़िग बनाएं।

डिज़ाइन सिस्टम फाउंडेशन

टेलविंड पर आधारित डिज़ाइन सिस्टम के लिए कॉन्फ़िगरेशन फाउंडेशन बनाएं।

टीम मानकीकरण

टीम प्रोजेक्ट्स में साझा करने के लिए एकसमान कॉन्फ़िग उत्पन्न करें।

Technical Guide

tailwind.config.js फ़ाइल टेलविंड सीएसएस वर्ग उत्पन्न करने को नियंत्रित करती है। सामग्री सरणी यह निर्दिष्ट करती है कि कौन सी फ़ाइलें वर्ग नामों (पेड़-शेकिंग अनुपयोगी सीएसएस के लिए उपयोग की जाती हैं) के लिए स्कैन की जानी चाहिए। डार्कमोड विकल्प क्लास (एक क्लास के साथ टॉगल करें) या मीडिया (ओएस प्राथमिकता का पालन करें) हो सकता है। थीम.एक्सटेंड ऑब्जेक्ट डिफ़ॉल्ट मानों को ओवरराइड किए बिना अनुकूलित मान जोड़ता है। एक्सटेंड में परिभाषित रंग bg-Primary, text-secondary आदि के रूप में उपलब्ध हैं। फ़ॉन्ट परिवार font-sans, font-serif, font-mono बन जाते हैं। अनुकूलित स्क्रीन ब्रेकपॉइंट डिफ़ॉल्ट प्रतिक्रियात्मक ब्रेकपॉइंट को ओवरराइड करते हैं। borderRadius DEFAULT कुंजी डिफ़ォल्ट राउंडेड वर्ग मान निर्धारित करती है। टेलविंड कॉन्फ़िग Defaults, फिर थीम मानों, और फिर थीम.एक्सटेंड मानों के क्रम में हल करता है। प्लगइन्स को अतिरिक्त उपयोगिताओं के लिए प्लगイン्स सरणी में जोड़ा जा सकता है। टाइपस्क्रिप्ट परियोजनाओं के लिए, आईडीई समर्थन के लिए @type एनोटेशन का उपयोग करें।

Tips & Best Practices

  • 1
    डिफ़ॉल्ट टेलविंड मूल्यों को खोने के बिना थीम.एक्सटेंड का उपयोग करके मान जोड़ें
  • 2
    सामग्री पथ सेट करें ताकि वे सभी फ़ाइलों को शामिल करें जो टेलविंड वर्गों का उपयोग करती हैं
  • 3
    डार्क मोड पर नियंत्रण के लिए वर्ग डार्क मोड रणनीति का उपयोग करें
  • 4
    ब्रेकपॉइंट्स को आपके डिज़ाइन सिस्टम ग्रिड विशिष्टताओं से मेल खाएं

Related Tools

Frequently Asked Questions

Q क्या यह मेरी मौजूदा टेलविंड कॉन्फ़िगरेशन को ओवरराइड करेगा?
उत्पन्न फ़ाइल के साथ अपनी मौजूदा tailwind.config.js को बदलें, या विशिष्ट अनुभागों को मर्ज करें।
Q क्लास और मीडिया डार्क मोड के बीच अंतर क्या है?
क्लास मोड में एक डार्क वर्ग जोड़ने की आवश्यकता होती है। मीडिया मोड स्वचालित रूप से उपयोगकर्ता ओएस डार्क मोड प्राथमिकता का अनुसरण करता है।
Q क्या मुझे सभी कॉन्फ़िगरेशन विकल्पों की आवश्यकता है?
नहीं, टेलविंड में समझदार डिफ़ॉल्ट्स हैं। केवल उन्हें कॉन्फ़िगर करें जिन्हें आप अनुकूलित करना चाहते हैं।
Q क्या मैं अधिक कस्टम रंग जोड़ सकता हूँ?
हाँ, थीम.एक्सटेंड में रंग वस्तु में अतिरिक्त रंग प्रविष्टियां जोड़ें।
Q मुझे कौन से सामग्री पथ उपयोग करने चाहिए?
उन सभी फ़ाइलों को शामिल करें जिनमें टेलविंड वर्ग हैं-आमतौर पर ./src/**/*.{js,ts,jsx,tsx,html}।

About This Tool

टेलविंड कॉन्फ़िग जनरेटर is a free online tool by FreeToolkit.ai. All processing happens directly in your browser — your data never leaves your device. No registration or installation required.