How to generate game icons and UI elements with AI
To generate game icons and UI elements with AI, pick an image type that comes out on a transparent background, describe one element per prompt, and build the rest of the set from the first one you like as a style reference. In Ludo.ai's Image Generator that is the item icon type for inventory and ability icons and the UI asset type for HUD pieces; both are generated without a background, while the plain icon type keeps its background. Both types can also be animated into a looping sprite sheet from a short motion prompt or up to three keyframes.
Last updated September 2026
What you need
- A short description of each icon or UI element
- Optional: one finished icon or piece of UI art to use as a style reference
1Pick the item icon or UI asset type
In the Image Generator, choose the item icon type (
item-icon) for inventory items and ability icons, or the UI asset type (ui_asset) for buttons, bars, panels and HUD pieces. These types are generated without a background; the plain icon type (icon) is not.2Describe one element per prompt
Write the object and its material, for example "red health potion in a round glass bottle" or "empty wooden health bar frame". Pick an art style, and the Square aspect ratio for icons that sit in square slots.
3Generate variations and choose the anchor
Generate several variations (up to 8 per request through the API) and choose the one that best fits your game. That image becomes the reference for the rest of the set.
4Build the set with Generate with Style
Switch the Generation Mode to Generate with Style, add the anchor image as the reference, and write a new prompt for each item (sword, shield, coin, key). Every new icon adopts the reference's style, so the set reads as one family.
5Fix edges and details
Use Edit Image to change a detail on one icon without regenerating it. If an image from another type still has a backdrop, Remove Background cuts it out.
6Animate icons or UI into a loop (optional)
Open the Sprite Generator with the icon or UI element as the starting image and choose the item icon or UI asset sprite type. Describe the motion ("the liquid swirls and glows brighter then dimmer") or set up to three keyframes, such as an empty bar, a half bar and a full bar. The steps are the same as in how to turn an image into a sprite sheet.
7Export for your engine
Download still icons as images, or take an animated element as a sprite sheet with an optional GIF and individual frames. Import them as UI textures, for example with Godot's TextureRect, or slice sheets with Unity's Sprite Editor.
Specs
| Transparent background types | item-icon and ui_asset (also sprite, sprite-vfx, logo, tile, portrait and others); plain icon keeps its background |
|---|---|
| Animatable image types | 12, including item-icon and ui_asset; plain icon is not one of them |
| Variations per request | 1 to 8 for a prompt, 1 to 4 when generating with a style reference (API) |
| Art styles | 32 plus Any style, including Flat Design, Hand-Painted and the 8-Bit, 16-Bit, 32-Bit and Hi-Bit pixel styles |
| Animation frames | 4, 9, 16, 25, 36, 49 or 64 per sheet |
| Animation frame size | 32 to 384 px, maximum resolution, AI 1.5x upscale, or matched to the input image |
| Animation outputs | Sprite sheet, plus optional GIF and individual frames |
| Keyframes | Up to three (initial, middle, final) |
Tips
- Choose item icon rather than plain icon when the art goes into a slot or hotbar: plain icon is generated with a background and is not one of the animatable types.
- Keep one anchor image per set and reuse it as the style reference for every new item, instead of chaining each new icon off the previous one.
- Prompt UI pieces without text or numbers and add labels in your engine, so one button or bar works for every language and value.
- For a bar that fills, generate the empty and full states and use them as keyframes, then map the game value to a frame index instead of playing the sheet on a timer.
- Re-running the same prompt gives different results, so save the variation you pick before generating the rest of the set.
FAQ
How do I keep a set of game icons consistent?
Generate one icon you like, then create the rest with Generate with Style using that icon as the reference. Each new prompt changes the object while the style follows the reference.
Do the icons come out as transparent PNGs?
The item icon and UI asset types are generated without a background. The plain icon type keeps its background; use Remove Background on those images if you need a cutout.
Can I make animated icons and UI elements?
Yes. Item icons and UI assets are animatable types in the Sprite Generator: describe the motion or set up to three keyframes, and you get a sprite sheet of 4 to 64 frames with an optional GIF.
What size should icons be for an inventory grid?
Design the slot size in your engine and scale the icon to it. For animated icons you can pick a frame size from 32 to 384 px, or match the size of the input image.
Can I make pixel art icons?
Yes. Choose one of the pixel art styles (8-Bit, 16-Bit, 32-Bit or Hi-Bit) when you generate the icon, and animate with Forge Pixel if the icon moves; see how to make and animate pixel art sprites.
Related
More guides for Image Generator
- How to keep a consistent art style across AI game assetsBuild every asset from one anchor image, fix strays with edits, and keep characters on-model into animation.
- How to make 2D game backgrounds and parallax layers with AIPick a background type, prompt the scene, keep one style, and stack parallax layers in your engine.
- How to make character portraits for RPG dialogue with AIGenerate transparent dialogue portraits, edit in expressions, keep the cast in one style, animate them.
- How to make card art for a card game with AIGenerate card illustrations in a portrait ratio, keep a set in one style, and animate them for digital cards.
- How to make seamless game textures with AIGenerate a tileable color texture, preview the repeat, animate it with Forge, and set it to repeat in engine.