Full website appears
Check the URL
Copy the generated overlay address again. The normal tool URL includes the full page; the overlay address includes ui=off.
Practical guide
Set Up a Controller Overlay in OBS
To show controller inputs in OBS, first confirm that GPADLAB's gamepad viewer responds in your browser. Copy its overlay URL into an OBS Browser Source, then check input again inside OBS. If the embedded browser cannot read your controller, capture the working browser window instead. Make a short recording before your stream.
Check each stage of the capture
- 01
Controller input
Buttons and sticks respond in the viewer.
- 02
OBS source
The same actions move inside OBS.
- 03
Recorded scene
The saved clip shows the whole overlay.
From working viewer to recorded overlay
You need OBS Studio, a connected controller, and the gamepad viewer. These steps describe GPADLAB's current controls. The layout changes the drawing; it does not change your controller's mapping or add game support.
- 01
Check the viewer before opening OBS settings
Open the gamepad viewer and press a face button. Move both sticks and pull the triggers. Choose a controller layout and theme that read clearly against your gameplay. Keep the normal viewer open until you know all the controls you want to show respond.
- 02
Copy the generated overlay address
In Use as OBS Browser Source, select Copy beside the URL. The generated address includes your layout and theme, hides the page controls with ui=off, and requests a transparent background with bg=transparent. Use that address rather than the plain tool URL.
- 03
Add and size the OBS source
Add a Browser Source to your scene and paste the address. Start with a width of 800 and height of 500, matching the viewer's setup panel. Place it above the gameplay source and resize it in the preview. These dimensions are a starting point, not a required streaming resolution.
- 04
Test input inside the source
Open the source's Interact window, focus the page, and press a controller button. Confirm that sticks and triggers move in OBS itself. The embedded browser is a separate input environment from your normal browser. If it stays still, use Window Capture for the browser window where the viewer works and crop to the controller.
- 05
Record a scene-change check
Record a short clip with gameplay, several button presses, and a scene switch. Watch the clip for cut-off edges, unreadable buttons, or frozen input. Keep only the intended window in the capture. Check the overlay again after changing USB ports, controller profiles, or OBS source refresh settings.
troubleshooting
Find the first point where the picture or input differs from the working viewer.
Picture is visible but never moves
Check source input
Try Interact and press a button. If your ordinary browser works but OBS does not, try Window Capture instead.
Controller is partly cut off
Check frame and scale
Restore the 800 by 500 source size, then reduce the viewer scale or resize the source. Avoid stretching width and height independently.
Overlay stops after a scene switch
Check source lifecycle
OBS can unload hidden sources or refresh them on scene activation. Review those options and retest input after the reload.
Window Capture has a solid background
Choose a readable frame
Window Capture records the browser's rendered window. Do not assume it preserves the webpage's alpha transparency; use a deliberate framed layout if needed.
Build and check your overlay
If input fails before capture
Frequently Asked
Controller Overlay in OBS questions
GPADLAB's viewer runs on the web. OBS Studio is separate desktop software used to compose and record the scene. You do not need a GPADLAB overlay executable.
Do not assume so. A pad can work in your normal browser but be unavailable in OBS's embedded browser. Confirm input in the actual source and use a working browser window as the fallback.
Video from a capture card does not carry controller button events into the browser. The viewer needs input available on the computer running it. This guide does not provide a console-input relay.
Check the selected viewer layout. Its labels are visual choices and may differ from the game's prompts. Verify the actual action for each button before recording a tutorial.
Do not rely on it. Window Capture may include the browser's own background. A Browser Source is the intended transparent route; a neatly cropped, solid-background panel is a practical fallback.
No. It displays inputs the page receives. OBS rendering, video capture, and playback add their own timing. A delay seen in the recording does not isolate the controller's hardware latency.
Sources
Further reading
Last reviewed
Published