For The Learn of ItReturn to Tools

PNG to MakeCode Image

Convert a PNG into MakeCode Arcade img literals and .jres entries for use in Visual Studio Code.

Use the built-in 16-color MakeCode Arcade palette.

Drop a .png file here, or click to browse

The img and .jres outputs are useful when importing into Visual Studio Code. There are no MakeCode blocks that convert img to .jres for you, so you need to copy both outputs into the right files: paste the img literal into images.g.ts and the .jres entry into images.g.jres. This pattern has worked best for embedding the image properly in the game.

Preview