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 объединяет несколько изображений в один оптимизированный спрайт-лист с готовым к вставке CSS, координатами JSON и переменными SCSS. Выберите макет: горизонтальная полоса, вертикальная полоса, сетка (с настраиваемым количеством столбцов) или упакованный (упакованный в контейнер для минимизации отходов пространства). Установите отступы между спрайтами, чтобы предотвратить растекание по краям. Результатом является один спрайт-лист PNG плюс сгенерированный CSS для каждого спрайта ('.sprite-icon-home { background-position: -0px -0px; … }'), карта координат JSON и переменные SCSS. Поддерживается масштабирование Retina @1x и @2x. Каждый спрайт получает имя исходного файла. Все работает локально - ваши изображения никогда не покидают ваше устройство. Создано для разработчиков игр, веб-разработчиков, использующих CSS-спрайты, и всех, кто хочет объединить небольшие значки в один сетевой запрос.
How It Works
Каждое входное изображение загружается в память; выбранный алгоритм макета (полоса, сетка или упаковка полок) вычисляет координаты (x, y, w, h) для каждого спрайта; спрайт-лист отрисовывается на холсте; CSS / JSON / SCSS генерируются из той же карты координат.
Use Cases
- •Объедините значки пользовательского интерфейса в один спрайт-лист PNG + CSS
- •Создайте атлас спрайтов для 2D-игры в Phaser или Pixi
- •Объедините значки социальных сетей в один CSS-спрайт для более быстрого сайта
- •Упакуйте кадры анимации персонажей в горизонтальную полосу
- •Создайте спрайт-лист @2x, готовый для Retina, из исходных изображений
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
Какой макет мне использовать?
Что такое bin-packing?
Могу ли я экспортировать CSS / JSON / SCSS?
Зачем использовать спрайт-лист?
Загружаются ли мои изображения?
Related Tools
Обрезка изображений
Обрезайте до любого соотношения сторон или формы - круг, сердце, звезда, шестиугольник - с поворотом и выравниванием.
Изменение размера изображений
Изменяйте размер изображений для Instagram, Twitter, LinkedIn и других платформ.
Конвертер форматов
Конвертируйте изображения между JPEG, PNG, WebP и другими форматами.
Генератор Favicon
Создавайте все размеры favicon, файл ICO, веб-манифест из любого изображения, текста или эмодзи.