CSS बॉर्डर रेडियस जेनरेटर
लाइव पूर्वावलोकन के साथ CSS border-radius को दृश्यात्मक रूप से बनाएँ और उत्पादन-तैयार कोड कॉपी करें।
border-radius: —;
100% निजी — सब कुछ आपके ब्राउज़र में चलता है। कुछ भी अपलोड नहीं होता।
CSS बॉर्डर रेडियस जेनरेटर के बारे में
CSS Border Radius Generator हल्के गोल कार्ड से लेकर जैविक ब्लॉब आकारों तक सब कुछ बनाता है। प्रीव्यू पर सीधे कोने के हैंडल खींचें, या हर कोने को संख्यात्मक रूप से सेट करें — पूरे आठ-वैल्यू सिंटैक्स सहित, जहां हर कोने का अलग क्षैतिज और ऊर्ध्वाधर रेडियस होता है। वही दूसरी धुरी अंडे, पत्ते, आंसू की बूंद और ब्लॉब को संभव बनाती है।
एक link-corners टॉगल क्लासिक एकसमान गोलाई के लिए सभी चार कोनों को समन्वित रखता है, जबकि उन्हें अनलिंक करने से हर कोना असममित आकारों के लिए स्वतंत्र हो जाता है। बारह प्रीसेट — rounded, pill, circle, squircle, दो blob, leaf, egg, arch, teardrop, petal और wave — दिखाते हैं कि यह प्रॉपर्टी क्या कर सकती है, और एक रैंडमाइज़ बटन लगातार नए जैविक आकार जनरेट करता है।
आप यूनिट बदल सकते हैं, अपने डिज़ाइन से मेल खाने के लिए एलिमेंट और कैनवास को फिर से रंग सकते हैं, और बेयर border-radius वैल्यू या पूरा CSS नियम कॉपी कर सकते हैं। यह टूल 100% क्लाइंट-साइड है — कुछ भी अपलोड नहीं होता।
CSS बॉर्डर रेडियस जेनरेटर का उपयोग कैसे करें
- प्रीव्यू पर कोने के हैंडल खींचें, या हर कोने को अलग-अलग एडिट करने के लिए “Link all corners” बंद करें।
- जैविक, ब्लॉब जैसे आकारों के लिए हर कोने का क्षैतिज और ऊर्ध्वाधर रेडियस सेट करें।
- अपनी यूनिट चुनें और संदर्भ में प्रीव्यू करने के लिए एलिमेंट व बैकग्राउंड रंग समायोजित करें।
- प्रीसेट आज़माएं — pill, squircle, blob, leaf, teardrop और अन्य — या रैंडमाइज़ दबाएं।
- border-radius वैल्यू या पूरा CSS कॉपी करें।