How to Draw a 16×16 Broad Steel Longsword in Pixel Art
This longsword spends almost three quarters of its visible pixels on the blade. Its width stays close to five cells for most of the diagonal, so material rendering matters more than hilt ornament. The upper-left edge uses a calm pale steel strip; the lower-right edge uses isolated white glints. Those two lighting rhythms make a flat 16×16 shape feel broad and bevelled.
The exact CC0 reference contains 98 visible pixels and 12 visible
colours. We will construct it in five stages. Coordinates use (x, y), with
the origin at the top-left.
Explore the complete drawing history
Step through the frames once before drawing. Show changes makes the two edge-light passes easy to compare with the later central shadows.
Step 1: block the broad blade in blue steel
Begin with a four-pixel black tip across x0–3 on row 0. From there, move the blade one cell down-right on nearly every row:
- Row 1: black at x0 and x4; steel at x1–3.
- Row 2: black at x0 and x5; steel at x1–4.
- Row 3: black at x0 and x6; steel at x1–5.
- Rows 4–9: keep five steel cells between two black edge pixels while shifting right.
- Row 10: black at x7; steel at x8–11.
- Row 11: black at x8; steel at x9–10.
Fill all 48 interior cells with blue steel #608888. At this stage the blade
should look like one broad, solid ribbon. Its narrowing in rows 10–11 creates a
short ricasso before the crossguard.
Do not add a black edge to the lower-right side of rows 10–11. The amber guard and its outline will close that part of the silhouette.
Step 2: light the two blade edges
The upper-left bevel uses pale steel #CEECEC. Place it at:
(1,1), (2,1), (3,1), (1,2), (4,2), (1,3), (2,4), (8,6), (9,7), (6,8), and (7,9).
The opposite bevel is sharper. Use steel shine #F4FEFE only at (5,3), (6,4), (3,5), (7,5), (4,6), and (5,7).
The pale edge is mostly continuous near the tip, while the white edge is broken into six flashes. Keeping those patterns different is the main trick: two matching strips would make the blade look like a glowing tube instead of metal.
Step 3: deepen the central steel planes
Carve deep steel #476367 into (2,2), (3,2), (2,3), (9,8), (8,9), (9,9), (10,9), and (9,10). The first cluster darkens the tip; the second
cluster collects near the guard.
Then finish the taper with three quieter values:
- base steel
#A5C9C9:(10,8)and(8,10); - shadow steel
#83A3A3:(11,9)and(9,11); - charcoal steel
#2F4049:(10,10),(11,10), and(10,11).
The remaining 16 interior cells stay blue steel. This is important: a bevel is read through contrast between planes, not by giving every pixel a unique shade.
Step 4: cross the hilt with a compact gold guard
Build the upper-right arm first. Put black at (13,8) and (14,8), amber #E0993C at (13,9), black at (14,9), amber at (12,10), and black at (13,10).
The centre is one bright gold pixel #FBBD5D at (11,11), closed on its right
by black at (12,11).
Mirror the direction, not the exact length, for the lower-left arm:
- Row 12: black x9, amber x10, black x11.
- Row 13: black x8, amber x9, black x10.
- Row 14: black x8–9.
Together these tiny arms create a second diagonal that crosses the blade. The guard is only 16 pixels, including outline, but its warm hue separates hilt from steel immediately.
Step 5: finish the leather grip and pommel
Place dark leather #7E4E26 at (12,12) and (14,14), with copper #C07F3A at (13,13) between them. This alternating three-pixel diagonal is the entire
grip surface.
Outline it with black at (13,12), (12,13), (14,13), (13,14), and (15,14). Close the pommel using black at (14,15) and (15,15).
The handle is intentionally much shorter than the blade. Enlarging it would steal area from the wide steel planes that define this particular sprite.
Exact row blueprint
| Row | Final non-transparent pixels |
|---|---|
| 0 | x0–3 outline |
| 1 | x0 outline, x1–3 light steel, x4 outline |
| 2 | x0 outline, x1 light steel, x2–3 deep steel, x4 light steel, x5 outline |
| 3 | x0 outline, x1 light steel, x2 deep steel, x3–4 blue steel, x5 shine, x6 outline |
| 4 | x1 outline, x2 light steel, x3–5 blue steel, x6 shine, x7 outline |
| 5 | x2 outline, x3 shine, x4–6 blue steel, x7 shine, x8 outline |
| 6 | x3 outline, x4 shine, x5–7 blue steel, x8 light steel, x9 outline |
| 7 | x4 outline, x5 shine, x6–8 blue steel, x9 light steel, x10 outline |
| 8 | x5 outline, x6 light steel, x7–8 blue steel, x9 deep steel, x10 base steel, x11 outline; x13–14 outline |
| 9 | x6 outline, x7 light steel, x8–10 deep steel, x11 shadow steel, x12 outline, x13 amber, x14 outline |
| 10 | x7 outline, x8 base steel, x9 deep steel, x10–11 charcoal, x12 amber, x13 outline |
| 11 | x8 outline, x9 shadow steel, x10 charcoal, x11 gold, x12 outline |
| 12 | x9 outline, x10 amber, x11 outline, x12 leather, x13 outline |
| 13 | x8 outline, x9 amber, x10 outline, x12 outline, x13 copper, x14 outline |
| 14 | x8–9 outline, x13 outline, x14 leather, x15 outline |
| 15 | x14–15 outline |
Watch the bevels appear separately
The automatic player first reveals the flat blade, then the two edge-light systems, then the darker centre. Pause between those frames to see how little the silhouette changes while the perceived volume changes dramatically.
Automatic drawing
Start with an empty 16×16 canvas
Draw the longsword yourself
Use the blue-steel block as your checkpoint. After lighting both edges, switch to Diff and correct the dark clusters near the tip and guard before adding the warm hilt.
Draw the broad steel longsword yourself
Rebuild all 98 visible pixels. Use Diff view to check the blade's two distinct edge-light patterns.
What this sprite teaches
- A broad blade needs planes, not noise. Large groups of repeated colour establish material surfaces.
- Opposite edges can use different rhythms. One continuous pale bevel and one broken white glint suggest directional light.
- Dark values belong near structural transitions. The deepest steel gathers at the tip and the ricasso.
- A tiny warm cross is enough for a guard. Colour contrast can replace extra size.
- Short handles preserve weapon proportion. Three grip pixels keep the blade dominant.
The source sprite is by Shade and is released under CC0 on OpenGameArt. The finished tutorial frame matches every source cell exactly.