Cursor Readability: Five Rules That Keep Pixel Pointers Usable

A pixel-art cursor that looks beautiful in a screenshot can be unusable in real life. These five rules separate the screenshots from the daily-drivers.

Rule 1 — Always outline

Every cursor needs a one-pixel dark outline along its entire silhouette. Without it, the cursor will disappear over any background that matches its fill color. With it, the cursor is readable on every background, period.

Rule 2 — One bright highlight

Add at least one pixel of pure white (or near-pure-white) on the cursor’s leading edge. The eye locks onto it.

Rule 3 — Animation is reserved for state

Animate busy, working, and progress only. Animating idle cursors makes the desktop feel restless.

Rule 4 — Don’t shrink the hotspot

The hotspot — the actual pixel that counts as the cursor’s position — must be in the same place visually as it is logically. If your arrow points up and to the left, the hotspot is at the tip, not the center. Off-by-one hotspots are the most common reason for “this cursor pack feels weird.”

Rule 5 — Test on three backgrounds

Hover over a Stack Overflow page (white), a code editor (black), and a YouTube thumbnail grid (chaotic color). If the cursor disappears on any of them, redesign.