Game art, generated

Unity UI Kit Generator

Design your whole screen once, then export a .unitypackage where every sprite already has its 9-slice borders set and its interaction states grouped.

Build a UI kitHow it works
Panels import with borders already set
A wide ornate panel sprite for a Unity UI kit
A round ornate panel sprite for a Unity game UI
Round panel
A framed panel sprite with a border for Unity uGUI
Framed panel
A light notched panel sprite for menus and dialogue
Notched panel
State families are ready for Sprite Swap transitions
A ring toggle in empty, selected, and pressed states for Unity sprite swap
Tabs
Three tab sprites in cream, green, and red for a Unity UI
Icons come out as separate transparent sprites
Game UI icons: cauldron, mortar, vial, jar, coin, heart, star, and scroll
Bars come as a separate track and fill
A progress bar track and fill sprite pair for a Unity slider

Why the import settings matter

Getting a button image takes seconds. Getting it usable in Unity takes longer. You set the texture type to Sprite, work out the four border values, type them into the sprite editor, then repeat for the panel, the tab, the tooltip, and the bar. Get a border wrong and the corner stretches the first time a label runs long.

The UI Kit Builder does that part for you. You design the whole screen as one concept, set the 9-slice borders once while reviewing the pieces, and export a .unitypackage where every sprite carries its own import settings: texture type Sprite, alpha is transparency, and the border values you set. Drop one on an Image, set the type to Sliced, and it scales correctly.

How it works

1

Start with the whole screen

Describe your game and the screen you need, then pick from the full-screen concepts you get back. Everything is drawn in one picture, so the panel and the button already share a palette, an outline weight, and a light direction.

Generated UI concepts for a cozy potion shop game
2

Rebuild it as separate sprites

The approved concept is rebuilt as a component sheet on a transparent background, every piece isolated. Ask for complete interaction states and buttons come back as full families: normal, hover, pressed, and disabled at matching dimensions, which is what a Selectable needs for Sprite Swap.

A component sheet with the pieces rebuilt from the concept
3

Import the package

Pick Unity on the export step, then double-click the .unitypackage or drag it into your project. Everything lands under Assets/SpriteCook/UI Kit with the borders already applied, and a bundled editor script under Tools can re-apply the sprite settings if you ever need to reset them.

What's in the Unity export

  • Assets/SpriteCook/UI Kit/Elements/: every element as a sprite, borders and alpha settings already applied
  • Assets/SpriteCook/UI Kit/ui-kit.spritecook.json: every piece with its type, state group, and border values
  • Assets/SpriteCook/UI Kit/Editor/: a Tools menu item that re-applies the sprite import settings
  • Assets/SpriteCook/UI Kit/concept.png: the screen the kit was designed from
  • Deterministic GUIDs, so exporting the same kit again updates those sprites in place rather than duplicating them

Keep going

UI Kit Builder guide

Every step and setting in the builder, in order.

The concept-first workflow

Why designing the screen first is what keeps a kit consistent.

Unity sprites guide

Import settings for the rest of your game art.

Game icon generator

The inventory icons that go inside this UI.

Frequently asked questions

Do I still have to set sprite borders in the sprite editor?+
No. The borders you review in the builder are written into each sprite meta before the package is built, so the values are already there when it imports. Set the Image type to Sliced and it scales correctly.
Does this work with uGUI or UI Toolkit?+
The sprites are built for uGUI, where an Image with type Sliced reads the border straight from the sprite. UI Toolkit can use the same PNGs, but you set the slice values in USS yourself; the manifest lists every border value so you can copy them across.
What about hover and pressed states?+
Ask for complete interaction states and each control comes back as a family at matching dimensions, grouped in the manifest. That maps directly onto a Selectable with the Sprite Swap transition.
Can I add more pieces to a kit later?+
Yes. A finished kit can generate a supplemental sheet based on your concept or on one of its existing sheets, so a later request for more buttons matches the ones you already imported. Export again and the package contains the full kit, old pieces and new.
Will it match the art style of my game?+
Describe the style in your own words, or add up to three reference images, like screenshots of your game. There is also a button that reads your references and writes the style description for you.
Can I use the UI in a commercial game?+
Yes. Everything you generate is yours to use commercially, including in games you sell.