Custom Color Palettes for MakeCode Arcade Games

Games made for modern consoles, handhelds, and computers have effectively unlimited color palettes -- 24-bit RGB graphics that offer millions of colors. But limited color palettes have a tremendous charm of their own, and are often necessary to deal with the memory limitations of plucky little handheld systems built with microcontrollers.

MakeCode Arcade games are made with 16-color palettes, and really we've only got 15 colors, since the first slot in the palette index is taken up by the transparent "color"! But fear not, some of your favorite iconic games of yore were made with only 2, 4, 8, or 16 colors, so we can rest assured that these constraints can still produce beautiful artwork!

History

In early systems, limitations on memory and display hardware forced creative use of small palettes. In fact, the arcade version of Mario Bros. introduced Luigi as a palette swapped version of his brother Mario! This meant not having to store an extra sprite in memory, just simply change the color indices.

In many cases, a fixed palette of colors is loaded along with a game level. You can see this in Super Mario Bros. for NES, where a different palette is used for outdoor, underground, dungeon, and underwater levels.

Fixed Palettes

Early consoles and 8-bit home computers often had a fixed palette (unlike MakeCode Arcade, which can use a palette of any 16 colors). This often lead to a recognizable "house style" for each system.

Here are the color palettes for the Apple II, ZX Spectrum, and IBM Color Graphics Adapter, as per the Wikipedia article on 8-bit computer hardware graphics.

This means that all games developed for those systems had to fit their graphics into their associated palettes (save for perceptual tricks such as dithering to create additional looks).

16-color Examples

Let's have a look at a couple of examples here of limited palettes that were chosen to work best with their subjects. The Industrial Pack by OllieBerzs and Dino Characters by Arks are both asset packs from itch.io

Here's what a 16-color palette for the industrial pack looks like (reduced from the original 40 colors):

You can tell that we need a different type of palette for these cute Dinos! Note how they each have shading that necessitates two values per hue, so two greens, two reds, two yellows, and two blues.

Remember our pal Trash Panda? Here's her splash screen in the original MakeCode Arcade palette:

Now here's how she looks with a "Matrix" style monochrome green palette:

Palette Swapping/Color Cycling Wizardry

We mentioned above the use of palette swapping to save memory for storing sprites in the example of Mario and Luigi. Another highly awesome use of this technique is to save frames of animation. Instead of swapping out a large number of sprite bitmaps, the animation of palette index colors can create beautiful, sophisticated effects, such as the work by Mark J. Ferrari (If you'd like to see more in depth on his techniques, please check out this Game Developer's Conference '16 presentation.)

Here's another great example of palette swapping used for a damage hit effect from Shovel Knight. Thanks to Mr. Certainly in the Adafruit Discord server for the suggestions!