☰ Docs menuDocs
Plans
PricingStreamrun Go (subscription)Streamrun Pro (pay-as-you-go)Guides
IRL StreamingDisconnect protectionDual Format streaming (horizontal & vertical)Switch device while streaming (stream shift)YouTube Dual StreamingTwitch Dual Format StreamingUpload and streamBilling
Streamrun pricingBilling and creditsFree trialCompany
Contact usPrivacy policyTerms of serviceHTML Overlay
The HTML Overlay element renders a live website directly on top of your video stream. This makes it possible to add dynamic content such as animations, widgets, motion graphics, or sports scoreboards to your broadcast.
By setting the HTML body’s background color to transparent, the overlay blends seamlessly with your stream, letting the video remain visible behind the web content.
Settings
- Overlay URL: Website URL to load
- Fullscreen: Weather to fill the screen or enable size and position settings
- Size and position: Adjust the browser window size and position (from the top left corner). Frame sizes before adjustments are 1920x1080 for horizontal and 1080x1920 for vertical streaming
- Overlay visibility: Toggle HTML overlay's visibility while streaming. For example, show occasional ads or temporary graphics when you're away from the keyboard.
- Overlay audio: Mute or unmute HTML audio
- Advanced settings
- Rendering delay: Delay HTML rendering to sync with video latency (in milliseconds, e.g. 1000 = 1 second). The maximum value is 4000. This is useful in scenarios like sports streaming, where score updates in an HTML overlay scoreboard would otherwise appear before the goal is visible on the stream due to encoding latency.
- Audio gain:: Amplification of the audio signal (in percent). E.g. 100 = no change, 50 = half volume, 200 = double volume.
Ideas and use cases
Use HTML overlay to add interaction and branding to your stream.
- Chat overlays and alert
- Game clock and scoreboard overlays for sports
- Custom branding and advertisements
- Motion graphics
Join Streamrun Discord