a11y.skipToMainContent
1

सीएसएस बॉर्डर त्रिज्या जेनरेटर

सीएसएस गोलाकार कोनों में डायल करें - प्रत्येक कोने को स्वतंत्र रूप से सेट करें, स्विच इकाइयां, और स्वच्छ सीमा त्रिज्या सीएसएस कॉपी करें।.

Unit

Corner radius

px
px
px
px

Preview size

%
px

Preview

CSS

Was this tool helpful?
Send output to:
Advertisement

How to use Border Radius Generator

  1. प्रत्येक कोने स्लाइडर (या एक मूल्य टाइप करें) को शीर्ष स्तर, शीर्ष-दाएं, नीचे-दाएं और नीचे-बाएं के लिए त्रिज्या निर्धारित करने के लिए खींचें।.
  2. एक इकाई चुनें - px, % या em - और वैकल्पिक रूप से लिंक को सभी कोनों को एक साथ ले जाने में सक्षम बनाता है।.
  3. ब्लोब आकार के लिए प्रति कोने एक दूसरे खड़ी त्रिज्या जोड़ने के लिए अण्डाकार / कार्बनिक ब्लोब पर बारी।.
  4. सीएसएस की प्रतिलिपि पर क्लिक करने के लिए तैयार करने के लिए पेस्ट सीमा त्रिज्या घोषणा।.

सीमा त्रिज्या जेनरेटर क्या है?

CSS border-radius संपत्ति एक तत्व के बॉक्स के कोनों को गोल करती है। यह जनरेटर आपको सभी चार कोनों को नियंत्रित करने देता है - टॉप-लेफ्ट, टॉप-राइट, बॉटम-राइट और बॉटम-लेफ्ट - स्वतंत्र रूप से, लाइव पूर्वावलोकन के साथ ताकि आप इसे तोड़ सकें। px, % और em इकाइयों के बीच

स्विच, या प्रत्येक कोने को अलग क्षैतिज और ऊर्ध्वाधर radii देने के लिए अण्डाकार मोड को सक्षम करें। यह कैसे कार्बनिक "ब्लब" आकार बनाया जाता है। जब कोने मैच करते हैं, तो आउटपुट स्वचालित रूप से सबसे कम वैध शॉर्टहैंड में गिर जाता है।

Advertisement

FAQ

सीमा त्रिज्या वाक्यविन्यास में स्लैश क्या है?
स्लैश ऊर्ध्वाधर त्रिज्या से क्षैतिज त्रिज्या को अलग करता है। सीमा त्रिज्या: 50px / 20px प्रत्येक कोने को 50px क्षैतिज और 20px ऊर्ध्वाधर वक्र देता है, जो एक अंडाकार राउंडिंग का उत्पादन करता है। प्रत्येक पक्ष में चार मूल्यों के साथ आप कार्बनिक ब्लोब आकृतियां तैयार कर सकते हैं।.
क्या मुझे px या प्रतिशत का उपयोग करना चाहिए?
तत्व आकार की परवाह किए बिना निश्चित, पूर्वानुमान योग्य कोनों के लिए Px का उपयोग करें। % का उपयोग करें जब आप चाहते हैं कि राउंडिंग को तत्व के साथ स्केल करें - उदाहरण के लिए, सीमा त्रिज्या: एक वर्ग पर 50% एक आदर्श चक्र बनाता है।.
क्या यह सभी ब्राउज़रों में काम करता है?
हाँ। सीमा त्रिज्या हर आधुनिक ब्राउज़र में एक उपसर्ग के बिना समर्थित है, जिसमें अण्डाकार स्लैश वाक्यविन्यास शामिल है। कोई विक्रेता उपसर्ग की आवश्यकता नहीं है।.

Related tools

Author

MW
Marcus Webb"The DevTool Craftsman"

Full-Stack Developer & Tools Architect

Marcus has been writing code since the dial-up era. He has contributed to open-source developer tools, built CI/CD pipelines for startups, and debugged production incidents at 3 AM more times than he would like to admit. His philosophy is that the best developer tool is the one that gets out of your way, and he writes about practical tooling that helps teams ship faster with fewer headaches.

← Back to Developer Tools · All tags

Last updated:

Advertisement