टेलविंड सीएसएस प्लेग्राउंड तत्वों पर टेलविंड सीएसएस यूटिलिटी कक्षाओं को लागू करें और लाइव पूर्वावलोकन और एचटीएमएल आउटपुट देखें।

टेलविंड सीएसएस एक यूटिलिटी-फर्स्ट फ्रेमवर्क है जहां शैलियों को सीधे HTML में एकल-उद्देश्य वर्गों के माध्यम से लागू किया जाता है। वर्ग एक निरंतर नामकरण कन्वेंशन का पालन करते हैं: संपत्ति-मूल्य (जैसे, bg-blue-500, text-white, p-4)। रिस्पॉन्सिव वेरिएंट ब्रेकपॉइंट उपसर्गों का उपयोग करते हैं (sm:, md:, lg:, xl:)। स्टेट वेरिएंट प्यूडो-क्लास उपसर्गों का उपयोग करते हैं (hover:, focus:, active:)। डार्क मोड dark: उपसर्ग का उपयोग करता है। स्पेसिंग एक स्केल का उपयोग करता है जहां 1 इकाई = 0.25rem (4px) होती है। रंग एक शेड प्रणाली का उपयोग करते हैं जो 50 (सबसे हल्का) से 950 (सबसे गहरा) तक होती है। टाइपोग्राफ़ी वर्ग फ़ॉन्ट परिवार, आकार, वजन, लाइन ऊंचाई और ट्रैकिंग को नियंत्रित करते हैं। फ्लेक्सबॉक्स और ग्रिड यूटिलिटीज़ लेआउट संभालती हैं। @apply डायरेक्टिव दोहराए जाने वाले उपयोगिता पैटर्न को कस्टम वर्गों में निकाल सकता है। टेलविंड का JIT मोड केवल उन CSS को उत्पन्न करता है जो आपकी परियोजना में वास्तव में उपयोग किए गए वर्गों के लिए हैं।