スプライトシート生成ツール
複数の画像を1つのスプライトシートに結合します。WebおよびゲームWEB用のCSSとJSON出力を取得。
Drop images or click to upload
Add multiple images to combine
About Sprite Sheets
- • Combine multiple images into a single file to reduce HTTP requests
- • CSS background-position is used to display individual sprites
- • JSON format can be used with game engines and animation libraries
- • Add padding to prevent edge bleeding when scaling
Sprite Sheets - 技術的な詳細
Sprite sheets combine multiple images into one file, reducing HTTP requests and improving load times. CSS uses background-position to display individual sprites. Game engines use texture atlases (JSON format) for efficient rendering.
コマンドラインでの代替方法
# Generate with spritesmith (Node.js)\nnpm install spritesmith\n\n# Or use TexturePacker CLI\nTexturePacker --format json --data sprites.json --sheet sprite.png *.png