مولّد محمّلات CSS

حول هذه الأداة

ينشئ مولد مؤشرات التحميل حركات تحميل بـ CSS فقط بستة أنماط — spinner والنقاط القافزة والحلقة والنبض والأعمدة والحلقة المزدوجة — مع إمكانية ضبط الحجم واللون والسرعة والسماكة، ويُخرج كود CSS وHTML معًا.

طريقة الاستخدام

1. اختر نمط مؤشر التحميل.
2. اضبط الحجم واللون والسرعة والسماكة.
3. راجع المعاينة المباشرة.
4. انقر Copy CSS + HTML والصق الاثنين في صفحتك.

معلومات مفيدة

• لا تحتاج مؤشرات التحميل بـ CSS فقط إلى صور أو ملفات GIF أو JavaScript.
• تدور المؤشرات باستخدام @keyframes وtransform: rotate()، وهي طريقة فعالة للتحريك.
• الترميز عنصر واحد فقط، أو بضعة عناصر فرعية للنقاط والأعمدة.
• أضف role="status" وتسمية مخفية بصريًا مثل “Loading…” لكي تعلن قارئات الشاشة عن مؤشر التحميل.
• فكّر في إبطاء المؤشرات أو إيقافها عند تفعيل prefers-reduced-motion.

تعمل بالكامل داخل متصفحك — لا يتم رفع أو حفظ أي شيء تُدخله.

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