9-slice UI
Export 9-slice pixel UI that scales without smearing.
Define the safe corners and stretch area for pixel UI panels, then export metadata for engines that need NinePatchRect or sprite border settings.
Use it for buttons, windows, dialogue boxes, HUD panels, and inventory frames that need to resize.
Exports
- Pixel UI PNG
- 9-slice margin metadata
- Godot and Unity border hints
Validation checks
- Valid stretch area
- Integer raster scale
- Likely blur in game-engine defaults
- Palette and edge cleanup
From panel art to scalable 9-slice margins.
Define the safe corners and stretch area for pixel UI panels, then export metadata for engines that need NinePatchRect or sprite border settings.
- 1
Prepare the panel art
Clean the edges and corners so the UI panel has stable pixels before stretching is defined.
- 2
Set the 9-slice margins
Choose left, right, top, and bottom margins that protect the corners and isolate the stretch zone.
- 3
Check the stretch area
Confirm the center area can resize without damaging outlines, highlights, or corners.
- 4
Validate the export
Review scale, blur, and cleanup warnings before downloading the PNG and metadata.
- 5
Apply engine borders
Use the exported metadata for Godot NinePatchRect or Unity sprite border settings.