Pixel art food

Pixel art food

Bread, cake, fruit, meat, potions, and coffee. Food sprites almost never live alone. They live in a grid, next to twenty other items, and that context drives every decision about them.

Design for the grid, not for the sprite

A food icon is judged in a row of other icons at a glance, which is a harder test than looking good on its own.

Everything in the set needs a shared padding so nothing touches its cell edge, a shared outline colour, and roughly matched visual weight. A tiny berry next to a giant roast in the same grid makes the berry look like a mistake even if both are drawn well.

Draw them together in one file at final size rather than one at a time. Problems that are invisible in isolation are obvious in a row.

Stacks and quantity

Games with cooking or farming systems need to show more than one of a thing.

A stack is the same sprite offset by two or three pixels, repeated two or three times, with a slightly darker copy behind. It is not a new drawing, and treating it as one is a lot of wasted work.

Three is the useful maximum. Beyond that, a stack turns into a shapeless clump and a number label communicates it better anyway.

Rarity goes on the frame

The instinct is to make a legendary item gold. Resist it.

Recolouring the food itself breaks the thing that made it recognisable, and a gold apple and a gold pear look identical at 32x32. Put rarity in the cell border or background instead, so the item stays readable and the colour still communicates.

This also means one sprite serves every rarity tier, which is a meaningful saving in a game with a lot of items.

Cooked and raw

Food games need states, and states are mostly palette work.

Raw meat is pink with a pale edge. Cooked is brown with a darker crust. Burnt is near-black with the silhouette unchanged. Same sprite, three palettes, and Color swap does each transition in one pass.

Keeping the silhouette identical across states is deliberate. The player learns the shape once and then reads the colour, which is much faster than learning three separate sprites.