Sprite sheets
Every extra image request is a round trip your users wait through. The sprite sheet generator API takes a batch of images and packs them into a single atlas with a coordinate map, so a game, icon set or UI library ships as one file instead of dozens. Send the images, get back one PNG and the map that tells you where each piece lives.
Run it online
Run this on our servers with your account. Free tools run in your browser; this one bills your KIT balance per the price above.
Why atlases still matter
Icon fonts fell out of fashion, but the underlying problem never went away: dozens of small images mean dozens of connections, and connections are slow no matter how fast the pipe is. Game engines solved this decades ago with texture atlases, and the same trick works for web icon sets, UI component libraries and mobile app assets today. This endpoint automates the packing step that used to require a design tool plugin or a build-time script.
What you send and what comes back
POST the list of source images to /image/sprite and the task packs them using a rectangle-packing algorithm that favors a compact, roughly square output. The response, delivered by webhook or a signed link, includes the atlas image itself and a JSON map of each source image's name, x/y offset and width/height inside the sheet. That map is exactly what you feed into CSS background-position rules or a game engine's texture loader.
Where it fits in a pipeline
Teams call this endpoint as the last step of an asset-build workflow: icons get exported from a design tool, optimized, then packed. Because the task is asynchronous, it slots naturally into a CI job or a deploy script without blocking anything else — you fire the request, keep working, and the webhook lands when the atlas is ready. No polling loop required, though the signed link is there if you'd rather fetch on your own schedule.
Who actually needs this
Indie game developers packing sprite frames, design system teams shipping a single icon atlas instead of a hundred SVGs, and marketing sites trying to shave HTTP requests off a Lighthouse score all use this endpoint for the same underlying reason: fewer files, faster paint. It is not aimed at anyone doing photo editing — it purely packs and maps images you already have.
Pricing that matches the work
The cost is a small flat fee per request plus a per-image charge, so packing 5 icons and packing 200 sprite frames are billed proportionally to the actual work done. A failed task is never charged — the packer retries automatically before returning a clear error, so you only pay for atlases that actually get built.
What you can do with it
Icon library shipped as one file
A design system team exports 80 SVG-derived PNG icons nightly and packs them into a single atlas plus a CSS-friendly coordinate map for the component library.
2D game sprite frames
An indie studio packs a character's walk-cycle frames into one sheet so the game engine loads a single texture instead of issuing a draw call per frame.
Marketing site request reduction
A landing page with 30 small trust badges and payment logos packs them into one atlas to cut load-blocking requests ahead of a performance audit.
Mobile app asset bundling
A mobile team bundles onboarding illustrations into a single atlas at build time to reduce app package size and asset-loading calls.
FAQ
How does the sprite sheet generator API arrange the images?
It uses a rectangle-packing algorithm that arranges the supplied images to minimize wasted space and keep the output roughly square; you don't control placement manually.
What formats can I send in?
PNG, JPEG and WebP source images are accepted; the output atlas is delivered as PNG to preserve transparency where present.
Do I get a coordinate map with the atlas?
Yes, the result includes a JSON map with each image's name, position and dimensions inside the sheet, ready for CSS or a game engine.
Is there a limit on how many images I can pack at once?
You can submit a batch in a single request; very large batches simply take a little longer since billing and processing scale per image.
Is this API free to use?
There's no free tier — free tiers get abused and slow everyone down. Access runs on a prepaid ForHosting KIT balance: top up from $10.00 (it never expires) and each request is charged at its published price, so a call with no balance returns HTTP 402. No subscription, no tokens, no invented credits, and a failed task is never charged.
How do I get the result — polling or webhook?
The task runs asynchronously and returns a task_id immediately; the finished atlas and map arrive via signed webhook, or you can fetch them from a signed link valid for 24 hours.
What happens if packing fails?
The task retries automatically up to three times; if it still fails you get a clear error and are not charged for that request.
Can I use this instead of an icon font?
Yes, an image atlas with a coordinate map covers the same use case as an icon font — fewer requests than individual files — without needing font-loading behavior or icon-glyph mapping.
For developers — API access
Everything on this page is available programmatically. This section is for teams who want to wire it into their own systems; everyone else can just use the tool above.
API endpoint
Prefer to automate it? One authenticated POST creates the task; the result comes back by webhook or a signed link. The same capability also runs here on the web, and soon from our app, email and Telegram.
Call it from your stack
curl -X POST https://api.kit.forhosting.com/image/sprite \
-H "Authorization: Bearer $KIT_KEY" \
-H "Content-Type: application/json" \
-d '{"image":"https://ejemplo.com/imagen.jpg"}'const res = await fetch("https://api.kit.forhosting.com/image/sprite", {
method: "POST",
headers: {
"Authorization": `Bearer ${process.env.KIT_KEY}`,
"Content-Type": "application/json"
},
body: JSON.stringify({
"image": "https://ejemplo.com/imagen.jpg"
})
});
const { task_id } = await res.json();import os, requests
res = requests.post(
"https://api.kit.forhosting.com/image/sprite",
headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
json={
"image": "https://ejemplo.com/imagen.jpg"
},
)
task_id = res.json()["task_id"]<?php
$res = file_get_contents("https://api.kit.forhosting.com/image/sprite", false, stream_context_create([
"http" => [
"method" => "POST",
"header" => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
"content" => '{"image":"https://ejemplo.com/imagen.jpg"}',
],
]));
$task = json_decode($res, true);body := bytes.NewBufferString(`{"image":"https://ejemplo.com/imagen.jpg"}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/image/sprite", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)Example request
{
"image": "https://ejemplo.com/imagen.jpg"
}Example response
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "image.sprite",
"status": "queued",
"_links": {
"result": "/tasks/tsk_…/result"
}
}The API is asynchronous: the call returns a task_id immediately and the result arrives by webhook. Polling is capped at 1 req/s per task.
Pricing
Published price — no tokens, no invented credits. A failed task is never charged.
Limits
max_mb | 15 |
max_megapixels | 12 |
Errors
| HTTP | Code | Meaning |
|---|---|---|
401 | unauthorized | Missing or invalid API key. |
402 | insufficient_balance | Your balance doesn't cover the task price. |
404 | unknown_type | That task type doesn't exist. |
429 | rate_limited | Too many requests. Use the webhook instead of polling. |