Fitts Law

Fitts's Law

Fitts's Law is the foundational quantitative model of how long it takes to acquire (point to) a target with a directed movement. The classic formulation:

T = a + b · log₂(D / W + 1)

Where T is movement time, D is the distance from the starting position to the target, W is the target's width along the axis of motion, and a, b are device-and-context constants. The logarithmic relationship is the core insight: doubling the size of a target reduces movement time by a constant amount; halving the distance to a target also reduces it by a constant amount; targets at the edges of the screen are effectively infinite in one dimension because the cursor stops there.

Definition (in our own words)

The time to move a cursor or finger to a target is determined by two things: how far the target is from where you start, and how big the target is. Big nearby targets are fastest; small distant targets are slowest. Edges and corners of the screen are exceptional: the cursor (or finger) cannot overshoot, so they behave as effectively infinite-sized targets along that one axis.

Origins and research lineage

• Fitts (1954) "The information capacity of the human motor system in controlling the amplitude of movement" — the original paper, derived from a peg-in-hole task with varying target sizes and distances.
• Card, Moran & Newell (1983) incorporated Fitts's Law into the early HCI canon as one of the foundational "pointer mechanics" laws.
• MacKenzie (1992) refined the formulation to better handle on-screen pointer tasks (the form above is "Shannon's formulation," credited to MacKenzie).
• Mobile / touch research (Henze, Bailly, and many others) has extended Fitts's Law to touch-screen interaction, where the "pointer" is a finger with a wider effective contact area than a cursor.

The law has held up across input modalities (mouse, trackpad, touch, stylus, eye-tracking) for over half a century. The constants change; the relationship doesn't.

Why Fitts's Law matters

Every clickable element imposes a Fitts's Law cost — a small one for big nearby buttons, a large one for tiny distant ones. On a single screen the cost is barely perceptible. Multiplied across a workflow with many clicks, the costs compound.

Worse, small targets aren't just slower; they're less reliable. The user may overshoot, undershoot, or miss entirely — leading to misclicks that cost a redo or, worse, an unintended action.

For touch interfaces, Fitts's Law is also an accessibility issue. Users with motor impairments, tremor, or one-handed use cases pay a much higher cost on small targets than typical users do.

When to apply

• Sizing buttons and icon buttons. Especially in dense UI where the temptation is to shrink them.
• Designing for touch. Mobile, tablet, kiosk, and any screen the user touches.
• Designing toolbars and menus. Distance between current cursor and likely target matters.
• Designing screen-edge interactions. Edge gestures, edge-aligned navigation, full-bleed CTAs.
• Designing for accessibility. Larger targets benefit users with motor or vision impairments and don't penalize anyone.
• Reviewing why users misclick something. Almost always a Fitts's Law diagnosis.

When NOT to apply (or when to be careful)

• Very dense expert UIs. Power users on familiar tools tolerate (and sometimes prefer) compact targets — they're using muscle memory, not search-and-acquire. A code editor's 16px tab close button is fine for daily users; not fine for new ones.
• When the law conflicts with safety. Destructive actions can deliberately use smaller or farther targets to make accidental activation harder. The Fitts's Law cost is intentional.
• When the law conflicts with hierarchy. A primary action is bigger because it's primary, not because Fitts's Law mathematically demands it. Hierarchy and Fitts's Law usually agree (primary = larger = faster), but when they don't, hierarchy is often the right tiebreaker.

Practical sizes

The most common Fitts's Law decisions are about minimum target size. Standards converge on:

The numbers are minimums; bigger is usually better when space allows.

Distance: the other half of the equation

Target size gets most of the attention, but distance matters equally. Two strategies:

Place high-frequency targets close to the user's natural starting position

After the user clicks "Add row," their cursor is wherever they clicked. The next thing they're likely to do (label the new row) should be close by. Don't make them traverse the screen.

Use proximity for related actions

If a user just clicked a row to select it, the contextual actions (edit, delete, share) should appear near that row — in a row-action toolbar or popover — not in a sidebar or a top toolbar 600px away. Distance kills speed.

Use anchored controls for sustained interaction

A floating action button (FAB) is anchored — distance from any starting cursor position is roughly constant. For mobile in particular, this is a Fitts's Law win.

Edges and corners: the magic real estate

Because the pointer cannot move past the screen edge, edges and corners act as effectively-infinite targets along one axis. This is why Mac's menu bar lives at the top edge (cursor can fly up without overshooting) and why Windows's Start button lives at the corner (zero precision required to hit).

In web UIs:

• Sticky headers at the top edge: navigation links there are easier to hit than mid-page.
• Fixed bottom toolbars on mobile: thumb travels naturally to the bottom; the bottom edge stops it.
• Side sheets that slide in from the right: their edge is anchored to the screen edge, easier to grab than mid-screen panels.

A common modern web mistake: pages with no bleed, where every interactive element has 24px+ of margin. The screen edge advantage is forfeited.