Creation
Generator arkuszy sprite
Połącz wiele obrazów w arkusz sprite z wyjściem CSS, JSON i SCSS dla programistów.
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 Generator arkuszy 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="Generator arkuszy sprite by OptiPix" loading="lazy"></iframe> <p style="font-size:12px">Free tool by <a href="https://optipix.art/sprite-sheet">OptiPix Generator arkuszy 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 Generator arkuszy sprite
Last updated: May 2026
Generator arkuszy sprite OptiPix łączy wiele obrazów w jeden zoptymalizowany arkusz sprite, z gotowym do wklejenia kodem CSS, współrzędnymi JSON i zmiennymi SCSS. Wybierz układ: poziomy pasek, pionowy pasek, siatka (niestandardowa liczba kolumn) lub upakowany (upakowany w pojemnikach, aby zminimalizować straty). Ustaw odstępy między sprite'ami, aby zapobiec wyciekaniu krawędzi. Wynikiem jest pojedynczy arkusz sprite PNG plus wygenerowany kod CSS dla każdego sprite'a ('.sprite-icon-home { background-position: -0px -0px; … }'), mapa współrzędnych JSON i zmienne SCSS. Obsługiwane skalowanie Retina @1x i @2x. Każdy sprite jest nazwany zgodnie z nazwą pliku źródłowego. Wszystko działa lokalnie - Twoje obrazy nigdy nie opuszczają Twojego urządzenia. Stworzone dla twórców gier, twórców stron internetowych używających CSS sprite'ów i każdego, kto chce połączyć małe ikony w jedno żądanie sieciowe.
How It Works
Każdy obraz wejściowy jest ładowany do pamięci; wybrany algorytm układu (pasek, siatka lub upakowanie w pojemnikach) oblicza współrzędne (x, y, w, h) dla każdego sprite'a; arkusz sprite jest renderowany na płótnie; kod CSS / JSON / SCSS jest generowany z tej samej mapy współrzędnych.
Use Cases
- •Połącz ikony interfejsu użytkownika w jeden arkusz sprite PNG + CSS
- •Utwórz atlas sprite'ów dla gry 2D w Phaser lub Pixi
- •Połącz ikony mediów społecznościowych w jeden CSS sprite dla szybszej strony
- •Upakuj klatki animacji postaci w poziomy pasek
- •Zbuduj arkusz sprite @2x gotowy na Retinę z obrazów źródłowych
You Might Also Like
If you find Generator arkuszy 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
Jakiego układu powinienem użyć?
Co to jest upakowanie w pojemnikach?
Czy mogę wyeksportować CSS / JSON / SCSS?
Dlaczego używać arkusza sprite?
Czy moje obrazy są przesyłane?
Related Tools
Przycinanie obrazów
Przycinaj do dowolnego współczynnika proporcji lub kształtu – koło, serce, gwiazda, sześciokąt – z obracaniem i prostowaniem.
Zmieniacz rozmiaru obrazów
Zmieniaj rozmiar obrazów dla Instagram, Twitter, LinkedIn i innych.
Konwerter formatów
Konwertuj obrazy między JPEG, PNG, WebP i innymi.
Generator favicon
Generuj każdy rozmiar favicon + plik ICO + manifest webowy z dowolnego obrazu, tekstu lub emoji.