Sandbox Panel UI Kit — title-barred panels and buttons

Voxel on a light ground. The extrusion, the three fixed tones per block and the unchanging light angle are identical to the dark voxel family — what changes is that on a pale surface the shaded right face has to be much darker relative to the front, or the block stops reading as a block and starts reading as a rectangle with a stripe.

Two nine-slice panels — a title-barred window frame with 0 px corners and a recessed inset frame with 0 px corners — cover almost every box a menu needs: dialogs, inventory grids, list backgrounds, tooltips and stat panels. A title band is built into the top of the panel, so a dialog header needs no second sprite and no manual alignment. Both stretch cleanly to any size because the corners never scale and the centre is a flat fill.

On top of the panels sit four chamfered button states: default, hover, pressed and disabled. They are drawn on the same 112×40 base with 0 px corners, so you can swap the texture on a single button widget and get the whole interaction loop without moving a rectangle. The pressed state drops its face two pixels and removes the top highlight rather than just darkening, which is what makes a button feel clicked rather than merely recoloured.

Everything ships twice. The SVG sources are the files the kit was drawn in — open them, change the six desert tan tones or the single sky blue accent, and re-export. The PNG exports are flat, transparent and pre-scaled at 1x, 2x and 4x for engines that want bitmaps, with no premultiplied alpha and no baked-in shadow outside the sprite bounds.

Creative Commons Zero 1.0 — Public domain. No credit required. Full terms · What this means in practice