If OBS is not displaying your browser and you’re thinking, “It was fine until yesterday…” or “I’m sure the settings are correct…”, you’re not alone.

The reason a browser might not display in OBS is not singular; it can arise from overlooked settings or compatibility issues between your PC’s features and OBS.

This article explains the main reasons why browser sources may not appear in OBS and how to address these issues.

If you’re frustrated with OBS display issues, follow each step to achieve an optimal streaming environment.

Common Phenomena When the Browser Does Not Display in OBS

The primary symptom is that the web page set in the browser source appears completely black or white.

This includes situations where the frame is visible but content is missing, or only audio plays without visuals when adding URLs for comments or streaming widgets via a browser source.

These phenomena can occur even with the latest version of OBS. Common reports include, “It used to display but suddenly stopped,” or “Only the browser doesn’t display while other sources do.”

Moreover, it’s reported that OBS rarely displays an error when a browser display issue arises. Since it may seem like sources are added normally at a glance, it’s crucial to methodically check possible causes.

Main Causes for Browser Not Displaying in OBS

When a browser source does not display in OBS, potential major causes can be grouped into three categories:

• Issues with hardware acceleration and GPU
• Problems related to versions and plugins
• Configuration errors of the browser source

Let’s examine each in detail.

Issues with Hardware Acceleration and GPU

The first main reason the browser might not display in OBS is “hardware acceleration,” which is used for rendering the browser source.

On laptops with dual GPUs, if OBS itself and the browser rendering process run on separate GPUs, it might result in black screens due to shared video issues.

There are reports on official forums saying, “Disabling ‘Enable browser source hardware acceleration’ in OBS settings made it display.”

Reference: OBS Open Broadcaster Software

When hardware acceleration is turned off, browser rendering switches to CPU processing, which can resolve display issues in some environments.

However, it might increase CPU load, so it is generally recommended to keep it on. Only turn it off when displaying low-load pages or facing display issues.

Here’s how to configure these settings:

1. “Settings”

2. “Advanced Settings”

3. In “Sources,” uncheck “Enable browser source hardware acceleration”

Problems Related to Versions and Plugins

Issues with the OBS itself or the browser source version may also lead to the browser not displaying. This can occur if OBS is outdated or incompatible with OS updates.

For instance, when macOS “Big Sur” was released in 2020, compatibility issues with older OBS versions led to scenes with browser sources not loading, and OBS itself failing to start (resolved with OBS 26.1.2 and later).

Reference: OBS Open Broadcaster Software

OBS updates are frequent. Older versions might encounter already resolved bugs, so try updating to the latest version from the official site first.

External tool plugins can also interfere with browser sources and cause issues. Try disabling plugins temporarily to see if it resolves the problem.

Configuration Errors of the Browser Source

Among the reasons the browser might not display in OBS are surprisingly common are display issues due to configuration errors.

Here are common configuration errors and their solutions:

Configuration Item	Common Mistakes	Solution
URL Specification	– Mistyped URL – Missing “https://”	Enter the correct URL, ensuring it starts with “http://” or “https://”.
Local File Check	The checkbox remains checked while specifying a URL	Confirm whether to check on or off depending on the purpose
CSS Effects	– “display: none;” set – Using text color same as background	Review CSS settings to ensure there are no display style issues
Width & Height Settings	– Width or height set to 0px or 1px – Elements extend beyond the screen	Set to a sufficient size (e.g., 1,280×720) and adjust positioning

Each configuration item will be described later, but first, consider possible setting errors.

Review Areas for Configuration When OBS Browser Source Does Not Display

If the browser source does not display in OBS, review the following three configuration areas:

• Recheck basic addition steps
• Review the “Shutdown source when not visible” item
• Review custom CSS, width, and height

If you want to learn about dealing with screen capture issues, refer to the following article as well:

>>Detailed Guide on Screen Capture in OBS: Solutions When It’s Not Displaying

Recheck Basic Addition Steps

First, confirm that the steps to add a browser source are correct. If displaying “interactive pages” or “content with audio,” a configuration error could prevent proper playback.

Here’s how you proceed with the steps:

1. From the “+” button at the bottom of the OBS screen, select “Browser” for new creation

2. In the properties window, input the URL of the page you want to display in the “URL” field
⇒ “Local File” is for displaying an HTML file on the PC, not the web. If left checked when specifying a URL, it will remain blank, so be careful.

3. Appropriately set the width and height of the browser display area
⇒ The default value is 800×600 pixels. If you want to display on the entire streaming screen, set it to match the canvas resolution (e.g., 1,920×1,080). If too small, the content might appear cut off.

4. Press “OK” to close the properties

Review the “Shutdown Source When Not Visible” Item

Check the “Shutdown source when not visible” option in the browser source’s properties.

Enabling this option unloads (shuts down) the browser page when the source becomes invisible on the scene (when the eye icon is off or switching to another scene).

For example, notification widgets via the browser will not display once shut down unless reloaded.

Only enable it if resource load is a concern, but be aware that the page will reload whenever returning to the scene.

Review Custom CSS and Width & Height

Next, review the “Custom CSS” and “Width & Height” in the properties.

The code entered in Custom CSS is additionally applied to the page. By default, CSS for making the background transparent and hiding the scroll bar is included, so if you’ve changed it, try deleting everything once.

Forum reports suggest “Deleting the content in the Custom CSS improved the display.”

Reference: OBS Open Broadcaster Software

Also, set “Width & Height” according to the resolution of the display area. Incorrect sizes may cause content to overflow excessively or appear small with excessive margins.

Solutions When Only Chrome Is Not Displayed by OBS Browser

If “other sites display in the browser source but only Google Chrome’s screen does not display in OBS,” try the following:

• Turn off Chrome’s hardware acceleration
• Clear Chrome’s cache

Let’s discuss each in detail.

Turn Off Chrome’s Hardware Acceleration

Chrome uses hardware acceleration to enhance display performance, but this can cause issues with OBS window capture that prevents screen display. While this has improved to some extent since OBS Studio version 25, it might still persist in certain environments.

To disable hardware acceleration in Chrome, follow these steps:

1. Open Chrome, and from the “︙” menu in the top right, open “Settings”

2. Select “System”

3. Turn off “Use hardware acceleration when available”

Clear Chrome’s Cache

If disabling hardware acceleration doesn’t change the symptoms, clear Chrome’s cache. While typically done to address specific site visibility issues, it might help rectify Chrome’s performance during OBS capture, potentially resolving the issue.

Here’s how to clear Chrome’s cache:

1. From Chrome’s settings menu, select “Clear browsing data”

2. Set the time range to “All time”

3. Check “Cached images and files,” and uncheck any items you don’t want to delete (such as browsing history and cookies)

4. Click the “Clear data” button to execute

Solutions When Switch Is Not Displayed by OBS Browser

When you want to display Nintendo Switch’s video on OBS, it typically involves capturing it via a capture board (video capture device) into OBS.

If Switch’s video doesn’t appear, try the following solutions (note: this pertains to display via a video capture device, not a browser source).

• Reconnect the capture board
• Select the “Video Capture Device” source

Reconnect the Capture Board

The first thing to suspect is the physical connection. Even if connections seem correct from Switch to capture board and PC, recognition failures or poor contact can prevent video display.

Listed below are common causes and solutions:

Cause/Condition	Symptom	Solution
Cable contact failure/loose connection	OBS browser not displaying, flickers then cuts out	Unplug all HDMI and USB cables, then securely reconnect
USB port specification mismatch	Data communication unstable or unrecognized	Ensure USB3.0 compatible devices are connected to a USB3.0 port (marked by blue connectors)
Cable disconnection	No physical signal transmission	Try a spare or alternate HDMI/USB cable

Select the “Video Capture Device” Source

To capture Switch’s video, use the “Video Capture Device” source. If another source like browser or game capture is selected, it won’t display. Double-check your selections.

1. In OBS’s source list, click “+” and select “Video Capture Device”

2. From the “Device” dropdown, select your capture board’s name
⇒ If the device name doesn’t appear, your PC isn’t recognizing the capture board. Check the driver and connections again.

Conclusion

The causes of a browser not displaying in OBS range from “configuration mishaps” to “hardware compatibility issues.”

Key areas to review include:

• Browser source hardware acceleration settings
• Chrome cache or configuration state
• Settings errors like incorrect URLs, CSS, or size specifications

Even if you are puzzled because “it was fine until yesterday,” calm review of your settings may likely resolve the issue.

For those seeking seamless streaming, verify each setting meticulously to attain a smoothly displaying browser source.

What’s Next After Solving OBS Display Issues?

Once you’ve resolved the browser source display issues in OBS, why not customize your streaming screen to make it more uniquely yours?
With Alive Studio, you can intuitively create a streaming screen that suits your style in no time.

• Access to over 1,400 background and small item materials by “Usaneko Memory,” a material creation team for VTubers!
• Unlimited use of over 100 BGM tracks provided by the music material site “Maou Soul”!
• Features include a Theme Roulette and Counter!
• Access all features for just ¥980 per month (tax included)!

If you want to make your streaming more personalized or create a screen tailored specifically to you, perhaps try Alive Studio.

＼ Try Free for 7 Days and Elevate Your Streaming! ／