⬜ مولد border-radius CSS — حواف مدورة
مولد حواف مدورة CSS مع تحكم مستقل لكل زاوية، أشكال أوراق وأشكال ديناميكية، معاينة مباشرة ونسخ الكود.
20%
20%
20%
20%
📚 عن هذه الأداة
border-radius يدوّر حواف العناصر. قيمة 50% تُحول مربعاً إلى دائرة. أربع قيم تتحكم في كل زاوية على حدة. النسبة المئوية تتكيف مع حجم العنصر، بينما البكسل يبقى ثابتاً.
❓ أسئلة شائعة
متى أستخدم % مقابل px؟
استخدم % للأشكال المتجاوبة (مثل أيقونات دائرية). استخدم px للأزرار والبطاقات التي تبقى بنفس الحدة بأي حجم.
كيف أصنع شكل ورقة؟
استخدم قيم غير متناظرة: 0 50% 0 50% أو 50% 0 50% 0.
هل يمكن قطع المحتوى الذي يفيض؟
نعم — أضف overflow: hidden للحاوية لتمنع الصور أو المحتوى من تجاوز الحواف المدورة.
هل border-radius يؤثر على overflow؟
نعم. العناصر الداخلية ستحتاج إلى overflow:hidden أو نفس border-radius لتظهر بشكل صحيح.