A character stopping at a wall, a bullet hitting an enemy, picking up an item by standing on it - all of it starts with a collision check that answers "did these two things overlap?" Even when your engine provides physics, how you shape your hitboxes strongly affects how the game feels, so the basics are worth knowing. This guide covers AABB, the most widely used method in 2D, and how to design hitboxes.
AABB: axis-aligned bounding boxes
An AABB (Axis-Aligned Bounding Box) wraps an object in a non-rotating rectangle and just checks whether two rectangles overlap. The logic is very simple: if two rectangles overlap on the x-axis and also on the y-axis, they're colliding; if they're apart on either axis, they aren't. It's cheap and predictable, which is why it's the default across most 2D genres - platformers, top-down, shooters.
Separate the sprite from the hitbox
Keep the drawing (sprite) and the collision area (hitbox) as separate things. The visible art has hair, a weapon, and effects sticking out, but a hurtbox based on just the torso feels fair. Conversely, making the player's attack box slightly generous so "barely touching" hits land feels good. In short, the baseline instinct is small hurtbox, generous hitbox.
Resolving a collision: undo the overlap
After detecting a collision, push the objects apart by the overlap. With AABB, a common approach compares the x penetration depth and the y penetration depth and pushes out only along the axis with the shallower overlap. That way a character walking along a wall slides smoothly instead of bouncing up and down. Splitting movement into separate x and y checks makes the implementation simpler.
Tunneling with fast objects
A fast object like a bullet can be in front of a wall on frame A and behind it on frame B, with no "moment of overlap" at all. That's tunneling. The fixes are a swept/raycast test that checks whether the movement path (a line segment) crosses the wall, or splitting one frame's movement into several small steps and checking each. Most engines expose this as a "continuous collision detection" option.
Practical checklist
- 1. Approximate with a box/circlepixel-perfect is rarely needed. Start with AABB or a circle.
- 2. Sprite is not the hitboxmanage the art and the collision area separately.
- 3. Small hurtbox, generous hitboxhurt on the torso only, attack a little generous.
- 4. Sweep-test fast objectscheck bullets and dashes along their path.
How complete the physics and collision features are depends on your engine. If you haven't chosen one, start with the game engine guide.
Frequently asked questions
Do I need pixel-perfect collision?
Most 2D games don't. Approximating with a rectangle (AABB) or a circle plays almost identically and performs much better. Pixel-level checks are only for the rare cases that genuinely need them.
Can't I just match the hitbox to the sprite?
A hitbox the full size of the sprite means getting hit on a strand of hair or the tip of a cape, which feels unfair. Usually you use a hitbox slightly smaller than the sprite, wrapping just the character's torso.
Fast bullets pass through walls.
If per-frame movement exceeds an object's thickness, the overlapping moment is skipped - that's tunneling. Fix it with a swept/raycast test that treats the path as a line segment, or by splitting one frame's movement into several smaller steps.
Related guides: Choosing a game engine · Adding game feel · Sprite size