Make a UI sprite scale without distortion
9-patch (9-slice) scaling keeps a sprite's corners fixed while stretching only its edges and centre, so a single small panel or button can scale to any size with crisp, undistorted corners. This free editor lets you set the fixed border, preview the stretch live and export the result, all in your browser.
Export .9.png or engine insets
Export an Android .9.png with the standard 1px guide border, or export the border insets as JSON for Unity sprite borders and Godot NinePatchRect margins. Either way the same four border values define how your UI sprite stretches.
Free, private, no upload
Everything runs locally in your browser — no sign-up, no watermark and no file limit — so your sprite never leaves your device. Drag the preview sliders to check the corners stay sharp at any size.
Frequently asked questions
What is a 9-patch / 9-slice?
It is a way to scale a UI sprite by splitting it into nine regions: the four corners stay fixed, the four edges stretch in one direction and the centre stretches in both, so panels and buttons resize without distorting their borders.
How do I create a 9-patch?
Upload a panel or button sprite, set the fixed border on each side, preview the stretch, then export an Android .9.png or the insets JSON for your engine — all in your browser.
What is a .9.png file?
A .9.png is Android's 9-patch format: the image gets a 1px border where black marks on the top and left edges define the stretchable region, and marks on the bottom and right define the content area.
Does it work with Unity and Godot?
Yes. Export the insets JSON and use the four values as a Unity sprite border or as Godot NinePatchRect patch margins; the .9.png export is for Android and engines that read 9-patch directly.
Is the 9-patch editor free?
Yes, completely free with no sign-up, no watermark and no limit on how many sprites you process.
Are my images uploaded to a server?
No. Slicing runs locally in your browser, so your sprites stay on your device.