Creation
تولید کننده شیت اسپرایت
چندین تصویر را در یک شیت اسپرایت با خروجی 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 تولید کننده شیت اسپرایت 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="تولید کننده شیت اسپرایت by OptiPix" loading="lazy"></iframe> <p style="font-size:12px">Free tool by <a href="https://optipix.art/sprite-sheet">OptiPix تولید کننده شیت اسپرایت</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 تولید کننده شیت اسپرایت
Last updated: May 2026
OptiPix Sprite Sheet Generator چندین تصویر را در یک صفحه اسپرایت بهینه شده ترکیب می کند، با CSS آماده برای چسباندن، مختصات JSON و متغیرهای SCSS. یک طرح بندی را انتخاب کنید: نوار افقی، نوار عمودی، گرید (تعداد ستون سفارشی)، یا بسته بندی شده (بسته بندی در جعبه برای حداقل فضای تلف شده). فاصله بین اسپرایت ها را برای جلوگیری از نشت لبه تنظیم کنید. خروجی یک صفحه اسپرایت PNG واحد به علاوه CSS تولید شده برای هر اسپرایت ('.sprite-icon-home { background-position: -0px -0px; … }')، یک نقشه مختصات JSON و متغیرهای SCSS است. مقیاس گذاری Retina @1x و @2x پشتیبانی می شود. هر اسپرایت به نام فایل منبع خود نامگذاری می شود. همه چیز به صورت محلی اجرا می شود - تصاویر شما هرگز دستگاه شما را ترک نمی کنند. ساخته شده برای توسعه دهندگان بازی، توسعه دهندگان وب با استفاده از CSS sprites، و هر کسی که می خواهد آیکون های کوچک را در یک درخواست شبکه واحد بسته بندی کند.
How It Works
هر تصویر ورودی در حافظه بارگذاری می شود؛ الگوریتم طرح بندی انتخاب شده (نوار، گرید، یا بسته بندی جعبه قفسه) مختصات (x, y, w, h) را برای هر اسپرایت محاسبه می کند؛ صفحه اسپرایت بر روی یک بوم رندر می شود؛ CSS / JSON / SCSS از همان نقشه مختصات تولید می شوند.
Use Cases
- •بسته بندی آیکون های UI در یک صفحه اسپرایت PNG + CSS واحد
- •ایجاد یک اطلس اسپرایت برای یک بازی 2D در Phaser یا Pixi
- •ترکیب آیکون های رسانه های اجتماعی در یک اسپرایت CSS واحد برای یک سایت سریعتر
- •بسته بندی فریم های انیمیشن شخصیت در یک نوار افقی
- •ساخت یک صفحه اسپرایت @2x آماده رتینا از تصاویر منبع
You Might Also Like
If you find تولید کننده شیت اسپرایت 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 و موارد دیگر تبدیل کنید.
تولید کننده Favicon
هر اندازه Favicon + فایل ICO + مانیفست وب را از هر تصویر، متن یا ایموجی تولید کنید.