Creation
مولد ورقة Sprite
دمج صور متعددة في ورقة Sprite مع مخرجات CSS و JSON و SCSS للمطورين.
Your files stay on your device - processed locally via WebAssembly, never uploaded
Drop sprites (PNG, JPEG, WebP)
Drop multiple files at once. Add more anytime.
Embed this tool on your website
Copy this code to add the مولد ورقة Sprite to your site for free. It runs entirely in your visitors' browsers - no API key, no usage limits.
<iframe src="https://optipix.art/embed/sprite-sheet" width="100%" height="600" style="border:1px solid #e4e4e7;border-radius:8px;" title="مولد ورقة Sprite by OptiPix" loading="lazy"></iframe> <p style="font-size:12px">Free tool by <a href="https://optipix.art/sprite-sheet">OptiPix مولد ورقة Sprite</a></p>
❤️ Love this tool? Support our team.
No ads, no tracking, no limits. Tips keep 104 tools free for everyone.
Secure payment via Stripe · No account needed
About مولد ورقة Sprite
Last updated: May 2026
يجمع OptiPix Sprite Sheet Generator بين صور متعددة في ورقة سبرايت محسّنة واحدة، مع تنسيق CSS جاهز للصق، وإحداثيات JSON، ومتغيرات SCSS. اختر تخطيطًا: شريط أفقي، شريط رأسي، شبكة (عدد أعمدة مخصص)، أو مجمعة (مُعبأة في حاويات لتقليل المساحة المهدرة). قم بتعيين مسافة بادئة بين السبْرايتات لمنع نزيف الحواف. الناتج هو ورقة سبرايت PNG واحدة بالإضافة إلى CSS مُنشأ لكل سبرايت ('.sprite-icon-home { background-position: -0px -0px; … }')، وخريطة إحداثيات JSON، ومتغيرات SCSS. يدعم القياس @1x و @2x للشبكية. يتم تسمية كل سبرايت باسم ملف المصدر الخاص به. كل شيء يعمل محليًا - صورك لا تغادر جهازك أبدًا. مُصمم لمطوري الألعاب، ومطوري الويب الذين يستخدمون سبْرايتات CSS، وأي شخص يرغب في تجميع الأيقونات الصغيرة في طلب شبكة واحد.
How It Works
يتم تحميل كل صورة إدخال في الذاكرة؛ يقوم خوارزمية التخطيط المختارة (شريط، شبكة، أو تعبئة حاويات الرفوف) بحساب إحداثيات (x, y, w, h) لكل سبرايت؛ يتم عرض ورقة السبرايت على لوحة رسم؛ يتم إنشاء CSS / JSON / SCSS من نفس خريطة الإحداثيات.
Use Cases
- •تجميع أيقونات واجهة المستخدم في ورقة سبرايت PNG + CSS واحدة
- •إنشاء أطلس سبرايت للعبة ثنائية الأبعاد في Phaser أو Pixi
- •دمج أيقونات وسائل التواصل الاجتماعي في سبرايت CSS واحد لموقع أسرع
- •تعبئة إطارات رسوم متحركة للشخصيات في شريط أفقي
- •بناء ورقة سبرايت @2x جاهزة للشبكية من صور المصدر
You Might Also Like
If you find مولد ورقة Sprite useful, check out these related tools: Image Crop, Image Resizer, and Format Converter. All tools run entirely in your browser with no uploads or signups required.
Explore more: Browse all tools · Step-by-step guides · Tips & tutorials · Compare tools
Frequently Asked Questions
ما هو التخطيط الذي يجب أن أستخدمه؟
ما هي تعبئة الحاويات؟
هل يمكنني تصدير CSS / JSON / SCSS؟
لماذا أستخدم ورقة سبرايت؟
هل يتم تحميل صوري؟
Related Tools
قص الصور
القص إلى أي نسبة عرض إلى ارتفاع أو شكل - دائرة، قلب، نجمة، سداسي - مع تدوير واستقامة.
مغير حجم الصور
تغيير حجم الصور لـ Instagram و Twitter و LinkedIn والمزيد.
محول الصيغ
تحويل الصور بين JPEG و PNG و WebP والمزيد.
مولد الأيقونات المفضلة
إنشاء كل حجم أيقونة مفضلة + ملف ICO + بيان الويب من أي صورة أو نص أو رمز تعبيري.