chevron_right

منشئ CSS Clip-Path

أنشئ أشكال CSS clip-path مع معاينة مباشرة.

الشكل

CircleEllipseInsetTriangleHexagonDiamondPentagonStarArrow

المعاملات

Radius: 50

Center X: 50

Center Y: 50

CSS المُنشأ

clip-path: circle(50% at 50% 50%);

ادوات مشابهة

منشئ Box Shadow

أنشئ ظلال CSS بصرياً مع معاينة مباشرة.

مولد CSS Keyframes

أنشئ keyframes مخصصة في CSS بشكل مرئي مع معاينة مباشرة وكود جاهز للنسخ.

منشئ Border Radius

تحكم في تدوير الزوايا بصرياً وانسخ كود CSS.

مولد CSS Grid

أنشئ تخطيطات CSS Grid متجاوبة مع معاينة مباشرة وكود جاهز للنسخ.

WebP متحرك إلى GIF

حوّل ملفات WebP المتحركة إلى GIF متحرك مع الحفاظ على الإطارات والتوقيت، داخل المتصفح.

محرر مسار SVG

حرّر واعرض بيانات مسار SVG التفاعلية (السمة d).

مرمّز كيانات HTML

حوّل الأحرف الخاصة إلى كيانات HTML. اختر بين الترميز الأساسي أو الترميز الكامل.

apps

شكّل العناصر بصريًا بدون رسم النقاط يدويًا

تسمح لك clip-path بإنشاء قصّات وأشكال ملفتة، لكن تعديل المضلع يدويًا ليس ممتعًا غالبًا. تساعدك هذه الأداة على تجربة الأشكال الشائعة بصريًا ثم نسخ CSS عندما تصل إلى الشكل المناسب.

متى تكون مفيدة أكثر

هي مناسبة لأقنعة الصور، والبطاقات ذات الأشكال غير المعتادة، والحواف الزخرفية للأقسام. قبل اعتماد CSS نهائيًا، جرّب الشكل مع النصوص والصور وأحجام الشاشات المختلفة للتأكد من أنه ما زال عمليًا.