ما هو مولّد حركات CSS؟

أنشئ حركات CSS بالإطارات المفتاحية بصرياً — بدون كتابة كود يدوياً. حدد الإطارات المفتاحية، واختر دوال التوقيت، واضبط المدة والتأخير، ثم انسخ كود CSS مباشرة إلى مشروعك. مناسب للأزرار ومؤشرات التحميل وتأثيرات التمرير وانتقالات الصفحات.

كيفية الاستخدام

1. اختر قالبًا جاهزًا للرسوم المتحركة (تلاشي، انزلاق، ارتداد، دوران) أو ابدأ من الصفر بإضافة إطارات مفتاحية على الخط الزمني.
2. اضبط الخصائص عند كل إطار مفتاحي — التحويل والشفافية واللون والحجم — واضبط منحنى التسارع والمدة وعدد التكرارات.
3. عاين الرسوم المتحركة فوريًا، ثم انسخ كود @keyframes المُولّد أو حمّله كملف .css.

النتيجة

يحتاج مطور واجهات أمامية إلى رسوم متحركة انسيابية لظهور بطاقات في صفحة معرض أعمال. يعدّ رسمًا متحركًا ease-out بمدة 0.6 ثانية يظهر تدريجيًا من 20 بكسل أسفل، ينسخ الكود ويطبقه بتأخير متدرج لكل بطاقة.

أدوات ذات صلة