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

إنشاء شكل متعدد الأبعاد، نجمة، شارة، هكساجون، وشفرون مع الهندسة الحالي CSS مقطع المسار.

يعمل في متصفحك. ملفاتك لا تغادر جهازك أبدًا. شاهد كيف تتحقق

…

كيف تفعل ذلك

  1. 1
    الخطوة 1: افتح مولد شكل مسار المقاطع CSS وأدخل بياناتك

    اكتب أرقامك أو نصك، أو أضف ملفك، أو اختر الخيارات التي تحتاجها. لا يتم رفع أي شيء: كل شيء يبقى في متصفحك.

  2. 2
    الخطوة 2: ماذا يفعل مولد شكل مسار المقاطع CSS

    إنشاء شكل متعدد الأبعاد، نجمة، شارة، هكساجون، وشفرون مع الهندسة الحالي CSS مقطع المسار.

  3. 3
    الخطوة 3: اقرأ النتيجة وقارنها

    تظهر النتيجة فورًا. غيّر قيمة واحدة لترى كيف تتغير الإجابة، ثم احتفظ بالرقم الذي يناسب حالتك.

  4. 4
    الخطوة 4: انسخ النتيجة أو احفظها

    انسخ النتيجة أو نزّلها. وقبل أي قرار مهم، تأكد منها من المصدر الرسمي أو من مستشار.

عن هذه الأداة

يسمح Clip-path للمطورين بقطع عناصر الصور والصور HTML إلى معالم متعددة الأبعاد الهندسية الدقيقة وأشكال دون الحاجة إلى أقنعة Photoshop أو SVG. اختر من المعدادات المسبقة الشائعة ، وفحص القناع المعروض في الوقت الحقيقي ، ونسخ إحداثيات CSS متعدد الأبعاد النقية جاهزة للإنتاج.

نصائح لأفضل النتائج

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

حقائق سريعة

الأسئلة الشائعة

ما هو CSS Clip-path؟

The `clip-path` CSS property creates a clipping region that determines which parts of an element or image are visible.

أي الأشكال مدرجة كإعدادات مسبقة؟

Presets include triangle, hexagon, 5-point star, product discount badge, navigation chevron, and circular masks.

هل يمكنني تصوير الصور ومقاطع الفيديو بهذا؟

Yes. Apply the generated clip-path CSS rule to any `<img>`, `<video>`, `<div>`, or card component in your stylesheet.

هل يؤثر مسار المقاطعة على صناديق الوصول التي يمكن النقر عليها؟

في المتصفحات الحديثة، فقط المنطقة المرئية غير المقطعة من العنصر تستجيب لحوادث تحريك المؤشر والنقرة.

مجاني تمامًابلا تكلفة وبلا تسجيل
ملفات خاصةكل شيء يعمل في متصفحك
سهل بلغتكمتوفر بلغات كثيرة