How to make a controller overlay viewers can actually read

An input overlay earns its space only if viewers can follow it at a glance, on a phone, through a compressed stream, with the game busy behind it. Unreadable overlays tend to fail in the same few ways, and each one takes a minute to fix.

Make pressed and idle differ in brightness, not just color

The most important thing is how clearly a pressed button stands apart from an idle one. Compression blurs fine detail and smears saturated colors, and some viewers cannot tell red from green at all. A dark idle state and a bright pressed state survives all of that; two colors of similar brightness do not.

In the gamepad.lol editor, the Theme tab has three colors. Keep Idle dark and let Opacity make the whole overlay a little see-through, make Pressed close to white or your brightest brand color, and use Accent for trigger fills and the short flash on press.

Size it for the smallest screen

Plenty of viewers watch on a phone, where a 1080p stream shrinks to a few inches wide. If you cannot follow the overlay on your own phone, your viewers cannot either. A good starting point is a fifth to a quarter of the canvas width; adjust from there after checking on a phone.

Set that size in the editor rather than stretching the source in OBS. A browser source renders at its own width and height, so scaling it up in the scene enlarges a smaller image and softens every edge.

At small sizes, turn off Button labels on the Skin tab. The shapes already carry the meaning, and tiny letters turn to mush once the stream is compressed.

Put it where the game is quiet

Place the overlay over a part of the frame the game leaves alone, usually a bottom corner the HUD does not use. Avoid the bottom center, where subtitles and dialogue appear, and keep clear of your webcam and alerts so they do not compete for attention. Keep it in the same spot in every scene; viewers learn where to look.

Show only what the game uses

A whole controller is a lot to take in. On the Layout tab you can hide any element: a shooter rarely needs the d-pad and menu buttons, a racing game is mostly triggers and one stick, a fighting game is face buttons and the d-pad. Fewer elements read faster, and you can drag the ones you keep closer together for a compact layout.

Let the sticks settle

A stick that twitches at rest pulls the eye toward nothing. Measure your sticks with the stick drift test and set the smallest deadzone that stops the flicker. The deadzone guide explains the trade-off.

Keep motion honest

Avoid effects that outlast the input. The overlay should show what your hands are doing right now; a press that lingers after release makes fast inputs harder to follow, not easier. The built-in Flash on press is brief on purpose: it marks the moment a button goes down, then settles into the pressed color.

Check it the way viewers see it

Before going live, record a short clip at your stream's bitrate, or open your stream on a phone, and watch the overlay during real play. That one check catches almost everything on this list.