टेलविंड प्लेग्राउंड
वास्तविक समय में टेलविंड सीएसएस कक्षाओं का परीक्षण और पूर्वावलोकन करें।
सेटिंग्स
तत्व प्रकार और सामग्री कॉन्फ़िगर करें
प्रीसेट उदाहरण
आमतौर पर उपयोग किए जाने वाले स्टाइल संयोजनों को तुरंत लागू करें
Button
Card
Badge
Alert
Input
पूर्वावलोकन
वास्तविक समय में स्टाइल किया गया परिणाम देखें
नमस्ते, टेलविंड!
उत्पन्न एचटीएमएल
वर्तमान सेटिंग्स के साथ उत्पन्न एचटीएमएल कोड
<div className="bg-blue-500 text-white p-4 rounded-lg shadow-md hover:bg-blue-600 transition-colors">नमस्ते, टेलविंड!</div>
💡 उपयोग युक्तियाँ
सामान्य कक्षाएं:
- •
hover:- होवर स्थिति शैलियाँ - •
focus:- फोकस स्थिति शैलियाँ - •
active:- सक्रिय स्थिति शैलियाँ - •
transition-colors- रंग संक्रमण प्रभाव
उत्तरदायी कक्षाएं:
- •
sm:- 640px और ऊपर - •
md:- 768px और ऊपर - •
lg:- 1024px और ऊपर - •
xl:- 1280px और ऊपर