यह चेकबॉक्स लाइब्रेरी मुफ्त सीएसएस चेकबॉक्स शैलियों के दर्जनों प्रदान करता है

की तलाश कर रहे हैं कस्टम चेकबॉक्स यूआई शैलियों अपनी वेबसाइट के लिए? पर एक नज़र रखना CSS चेकबॉक्स लाइब्रेरी GitHub पर मुफ्त में होस्ट किया गया.

यह विशाल पुस्तकालय चेकबॉक्स आइटम के लिए दर्जनों शैलियों का समर्थन करता है, कई अन्य आकृतियों के बीच स्लाइडर्स, ऑन / ऑफ डिजाइन, सर्कल और स्क्वायर जैसे.

आप HTML / CSS कोड का पूरा उपयोग करें, तो यह एक हवा है इसे पाने के लिए और अपनी साइट पर चल रहा है। इसका उल्लेख नहीं है यह पूरी तरह से खुला है और व्यक्तिगत और वाणिज्यिक दोनों परियोजनाओं के लिए उपलब्ध है.

आरंभ करने के लिए, आप गिटहब रेपो और पर जा सकते हैं स्थानीय रूप से सभी फाइलों को अपनी मशीन में डाउनलोड करें. या, आप npm के माध्यम से पुस्तकालय स्थापित कर सकते हैं.

डिफ़ॉल्ट रूप से, हर चेकबॉक्स शैली अपनी कक्षा के साथ आती है. checkboxes.min.css स्टाइलशीट में वह सब कुछ है जिसकी आपको आवश्यकता है, इसलिए यदि यह आपके पेज में शामिल है तो आप सभी सेट हैं.

हर चेकबॉक्स शैली IE9 सहित आधुनिक ब्राउज़रों और अधिकांश विरासत ब्राउज़रों का समर्थन करता है+.

इस पुस्तकालय के लिए वर्कफ़्लो शायद सबसे सरल मैंने कभी देखा है। एक बार जब आप स्टाइलशीट को अपने पेज पर जोड़ लेते हैं, तो बस मुख्य डेमो पर सभी शैलियों के माध्यम से खुदाई करें और देखो क्या बाहर खड़ा है.

वहां से, आप जो भी सबसे अच्छा काम करते हैं उसे चुन सकते हैं। HTML बटन पर क्लिक करना उस चेकबॉक्स के स्रोत कोड के साथ एक मोडल प्रदर्शित करता है. अब, बस इसे अपनी साइट में कॉपी / पेस्ट करें, इसे उचित नाम / मूल्य दें (यदि लागू हो), और आप सभी सेट हैं!

कोई परेशानी नहीं, बहुत कम अनुकूलन, और मूल रूप से कोई कोडिंग कौशल की आवश्यकता नहीं है.

आप हर चेकबॉक्स शैली को देखेंगे एक हल्के और अंधेरे विषय दोनों में आता है, अधिक से अधिक समर्थन के लिए। इसका मतलब है कि आपको अपनी वेबसाइट के साथ फिट होने वाले चेकबॉक्स को खोजने में कोई परेशानी नहीं होनी चाहिए। इसके अलावा, आप कर सकते हैं अतिरिक्त कक्षाओं का उपयोग करें जैसे कि .ckbx-छोटे या .ckbx-xlarge आकार बढ़ाने के लिए.

साथ में 25 + विभिन्न शैलियों और कई अलग एनिमेशन, मेरा कहना है कि यह CSS Checkbox लाइब्रेरी प्रभावशाली है। अपने वर्कफ़्लो में समय बचाने के लिए किसी भी फ्रंटएंड डेवलपर के लिए बढ़िया और किसी भी वेब फॉर्म के यूआई डिज़ाइन में सुधार करें.