Cells Are Your Canvas
Every cell in Excel is a rectangle you can color, resize, and border independently. When you line up dozens of small, square cells in a grid, you get a pixel display. This tutorial shows you how to design game UIs — character sprites, score panels, health bars, and game-over screens — entirely through cell formatting and a little VBA color code.
Step 1: Create Square "Pixels"
The key to a clean grid is making cells perfectly square. In VBA:
Sub SetupPixelGrid() Dim pixelSize As Single pixelSize = 18 ' points (approx. 24 px on screen) With ThisWorkbook.Sheets("Game") .Columns("B:U").ColumnWidth = 2.14 ' approx. square in default font .Rows("2:21").RowHeight = pixelSize End With End Sub
Manual method (no code needed):
- Select the columns you want, right-click → Column Width → type 2.14
- Select the rows, right-click → Row Height → type 16
- Zoom to 100% — your grid will look square on most monitors.
Step 2: Paint Cells with RGB Colors
Use Interior.Color with the RGB() function to set any color:
' Helper: paint a single cell at row r, column c Sub PaintCell(r As Integer, c As Integer, R As Integer, G As Integer, B As Integer) ThisWorkbook.Sheets("Game").Cells(r, c).Interior.Color = RGB(R, G, B) End Sub ' Fill the entire game area with a dark background Sub DrawBackground() Dim r As Integer, c As Integer For r = 2 To 21 For c = 2 To 21 PaintCell r, c, 15, 15, 30 ' deep navy background Next c Next r End Sub
Useful Color Palette
- Background:
RGB(15, 15, 30)— deep space navy - Player:
RGB(50, 200, 255)— bright cyan - Enemy:
RGB(255, 80, 80)— alarm red - Coin / Pickup:
RGB(255, 220, 50)— gold yellow - Wall / Terrain:
RGB(100, 100, 120)— slate gray - Empty / Erase:
RGB(15, 15, 30)— same as background
Step 3: Draw a Sprite with a 2-D Array
Define a sprite as a 2-D array where 1 = colored pixel and 0 = transparent (background color), then stamp it onto the grid:
Sub DrawSprite(topRow As Integer, leftCol As Integer) ' 5x5 arrow/ship sprite (1 = pixel, 0 = transparent) Dim sprite(1 To 5, 1 To 5) As Integer sprite(1,1)=0 : sprite(1,2)=0 : sprite(1,3)=1 : sprite(1,4)=0 : sprite(1,5)=0 sprite(2,1)=0 : sprite(2,2)=1 : sprite(2,3)=1 : sprite(2,4)=1 : sprite(2,5)=0 sprite(3,1)=1 : sprite(3,2)=1 : sprite(3,3)=1 : sprite(3,4)=1 : sprite(3,5)=1 sprite(4,1)=0 : sprite(4,2)=0 : sprite(4,3)=1 : sprite(4,4)=0 : sprite(4,5)=0 sprite(5,1)=0 : sprite(5,2)=0 : sprite(5,3)=1 : sprite(5,4)=0 : sprite(5,5)=0 Dim r As Integer, c As Integer For r = 1 To 5 For c = 1 To 5 If sprite(r, c) = 1 Then PaintCell topRow + r - 1, leftCol + c - 1, 50, 200, 255 ' cyan player Else PaintCell topRow + r - 1, leftCol + c - 1, 15, 15, 30 ' erase End If Next c Next r End Sub
Step 4: Build a Score Panel (HUD)
Reserve columns outside the play area as a heads-up display. Style the label cells with colored text and a matching background:
Sub SetupHUD() With ThisWorkbook.Sheets("Game") ' Score label .Cells(2, 24).Value = "SCORE" .Cells(2, 24).Font.Bold = True .Cells(2, 24).Font.Color = RGB(255, 220, 50) .Cells(2, 24).Interior.Color = RGB(15, 15, 30) ' Score value — updated by game logic .Cells(3, 24).Value = 0 .Cells(3, 24).Font.Size = 20 .Cells(3, 24).Font.Color = RGB(255, 255, 255) .Cells(3, 24).Interior.Color = RGB(15, 15, 30) ' Lives label .Cells(5, 24).Value = "LIVES" .Cells(5, 24).Font.Bold = True .Cells(5, 24).Font.Color = RGB(255, 80, 80) .Cells(5, 24).Interior.Color = RGB(15, 15, 30) End With End Sub Sub UpdateScore(newScore As Integer) ThisWorkbook.Sheets("Game").Cells(3, 24).Value = newScore End Sub
Step 5: Draw a Health Bar Using Cell Colors
A horizontal row of cells works perfectly as a health bar — green cells for remaining HP, dark-red cells for lost HP:
Sub DrawHealthBar(currentHP As Integer, maxHP As Integer) Dim i As Integer For i = 1 To maxHP If i <= currentHP Then PaintCell 7, 23 + i, 50, 220, 50 ' green = alive Else PaintCell 7, 23 + i, 60, 20, 20 ' dark red = lost End If Next i End Sub
Call DrawHealthBar(playerHP, 5) every time the player takes damage to update the bar instantly.
Pro Tips:
- Remove cell borders (Format Cells → Border → None) for a cleaner pixel look.
- Hide row/column headers (View → uncheck Headings) to make the game fill the screen.
- Set zoom to 150–200% on the game sheet for larger, more visible pixels.
Summary
Excel cells are surprisingly capable pixels. With square sizing, RGB color fills, and sprite arrays, you can build a compelling game UI entirely in a spreadsheet — no images required. Pair these techniques with the keyboard and timer events from the Advanced tutorial, and you have everything needed to build a fully playable Excel game from scratch.