Gamepad Viewer | Free Live Controller Overlay for Streams
Show your controller inputs live on screen for OBS, Streamlabs, or any Browser Source. Pick a layout, tune the scale and deadzone, copy the configured URL, and it stays consistent every time the scene loads.
Overlay settings
Five steps from a blank overlay to a stream ready Browser Source that stays configured every time you go live.
Connect
Plug in or pair your controller, then press any button so the browser detects it.
Pick a layout
Choose PlayStation, Xbox, Switch, or generic to match the controller you stream with.
Tune the settings
Adjust scale, deadzone, opacity, and background until the overlay looks right.
Copy the URL
Your settings are baked into the URL, paste it into a new OBS Browser Source.
Reuse every stream
The same URL loads the same configured overlay every time that scene activates.
Every setting is a URL query parameter, so the overlay is fully configurable from the address bar alone, useful for scene templates or scripted setups.
| Parameter | Values | What it controls |
|---|---|---|
| layout | ps5, xbox, switch, generic | Which controller diagram renders. PlayStation includes the touchpad, Switch uses the physical B A Y X ordering. |
| scale | 0.5 to 2.0 | Visual size multiplier for the diagram, purely cosmetic, does not affect readings. |
| dz | 0 to 0.5 | Deadzone radius, hides small stick movement so the overlay does not jitter from normal noise. |
| opacity | 20 to 100 | Overlay transparency as a percentage, useful for a subtle corner overlay that does not compete with gameplay. |
| bg | transparent, dark, light | Background mode, transparent is the default for OBS Browser Sources. |
| ui | on, off | Whether the settings panel is visible, the copied OBS URL always uses off so only the controller shows. |
Pick the layout matching your physical controller so viewers see the labels they expect. Any standard gamepad works with any layout, the diagram just looks most natural paired correctly.
Both live on this site because most people eventually need both, even if they only expected to need one.
The viewer's job
Look good on a screen that is not yours. Clean labeled buttons, a transparent or dark background, a scale slider that fits wherever you have room reserved in your layout, enough clarity that a viewer knows exactly what you pressed without you saying a word.
- Presentation first
- Built for an audience
- Clean over precise
The tester's job
Does not care how it looks, cares about being right. Raw button indices instead of friendly labels, exact decimal stick values instead of a dot that looks roughly centered, dedicated checks for drift, deadzone, uneven triggers, and buttons that drop fast repeated presses.
- Evidence first
- Built for one person, you
- Precise over clean
A gamepad viewer and a gamepad tester solve two different problems that happen to involve the same hardware. The viewer exists so an audience watching your stream can follow what you are doing on the controller. The tester exists so you personally can find out whether the controller itself is working correctly, down to the exact button index and decimal stick value.
Most sites pick one side and commit, which is a reasonable choice if a visitor only ever needs one. The problem is that most people do not know which one they need until they are already looking, and someone setting up a stream overlay today might be wondering next week why their aim has started drifting left.
This page covers the viewer side, the clean, labeled, audience facing overlay. The rest of Gamepad Tester covers the tester side, with dedicated tools for stick drift, deadzone, triggers, vibration, latency, and every other symptom worth checking, one click away rather than on some other site entirely.
Controller not appearing
The diagram stays gray and unresponsive even after connecting.
Read the fixOBS Browser Source shows a blank page
The source loads but nothing renders inside OBS itself.
Browse the Fix guidesStick still jitters at rest
If raising the deadzone does not settle it, the stick itself may have drift.
Run the Stick Drift TestRun the full controller benchmark
The viewer shows your inputs, the benchmark tells you whether your hardware is actually healthy. Run every diagnostic in sequence for one overall score.
Run the benchmarkWhat is a gamepad viewer
A gamepad viewer is a streamer facing overlay that shows your controller inputs as a live on screen diagram, so viewers can see what buttons you press and how you move the sticks while you play.
How do I add the gamepad viewer to OBS
Configure the layout, scale, and background on this page, click Copy OBS URL, then in OBS add a new Browser Source, paste the URL, and set the width and height to match the diagram. Check refresh browser when scene becomes active so the overlay reloads cleanly.
Why is my overlay background not transparent in OBS
Confirm the copied URL includes bg=transparent and ui=off. If it still shows a background, enable hardware acceleration in your OBS settings, since some older versions need it for transparent Browser Sources to composite correctly.
What is the difference between a gamepad viewer and a gamepad tester
A gamepad viewer is built to be watched, showing clean, labeled inputs for an audience on stream. A gamepad tester is built to be trusted, showing raw button indices and exact decimal values for diagnosing a hardware problem. This page covers the viewer, the rest of Gamepad Tester covers the tester side.
Can I use this overlay outside of OBS
Yes. Streamlabs, XSplit, and any broadcast software that supports a Browser Source URL works the same way, paste the configured URL, set dimensions, done.
Do I need to download anything
No. The viewer runs entirely in your browser, and your broadcast software loads the page directly from the URL, there is no extension to install and no executable to run.
Why does my Switch Pro Controller show face buttons in a different order
The Switch layout intentionally follows the physical B, A, Y, X printing on a Nintendo controller, which is the opposite of Xbox's A, B, X, Y ordering. Selecting the Switch layout matches what your viewers actually see printed on your controller.
What does the deadzone slider actually do here
It hides small stick movement below the set threshold so the overlay does not visibly jitter from normal sensor noise or mild stick drift. Use the smallest value that stops the jitter rather than a large number, since a very high deadzone can hide real input too.
Can I test a PS5 DualSense controller here
Yes. Select the PlayStation layout for the DualSense, which is supported over both USB and Bluetooth. Adaptive trigger resistance and detailed haptics are not something any browser based tool can read.
Can I use this with an Xbox controller
Yes. Xbox Series X and S, Xbox One, and Xbox Elite controllers all work with the Xbox layout over USB or Bluetooth.
Does this work with a generic or off brand controller
Yes, using the generic layout, which uses numbered buttons rather than platform specific labels so the diagram stays correct regardless of which physical buttons trigger which standard index.
Will the settings reset every time I open OBS
No. Because every setting is baked into the URL as a query parameter, OBS opens the exact same configured overlay every time that scene activates, with no need to reconfigure anything.
Does this work on mobile phones
The diagram and live input display work on mobile browsers that support the Gamepad API, though setting up the OBS URL is generally a desktop streaming workflow.
Is my controller input recorded or uploaded
No. All polling and rendering happens locally in your browser tab. Nothing is sent to a server, nothing is recorded, and closing the tab stops everything immediately.
My controller shows in the viewer but feels delayed on stream, why
Overlay rendering itself adds negligible delay. Perceived lag on stream usually comes from encoder settings, a busy OBS scene, or actual controller latency, which you can measure directly with the Latency Test.