مولد مسار مقطع CSS

أنشئ مسارات مضلعة وشكل مقاطع باستخدام معاينة تفاعلية. رائعة لأشكال الأبطال وأقنعة الصور.

CSS Clip Path Generator

Live

Shape

CSS output

clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);

Text / on-page input

تعمل مولدات الألوان وCSS بالكامل في متصفحك. لا تقوم المعاينات والتحويلات أبدًا بتحميل أنماطك.

استخدم CSS Clip Path Generator متى شئت: أنشئ مضلعًا وشكل مسارات المقاطع باستخدام معاينة تفاعلية.

تحقق من وجود CSS منافس على صفحتك (إعادة التعيين، الألوان الموروثة). انسخ القاعدة التي تم إنشاؤها إلى ورقة أنماط معزولة أولاً.

لا. يتم تشغيل المولدات والمحولات في متصفحك من خلال المعاينة المباشرة.

لا، افتح الأداة، وقم بتعديل عناصر التحكم، وانسخ ملف CSS.

Generate CSS triangles with border tricks — direction, size, and color.

Control each corner independently and preview rounded shapes with copy-ready CSS.

Build linear, radial, and conic gradients with live preview and copy-ready CSS.