logo

Live Production Software Forums


Welcome Guest! To enable all features please Login or Register.

Notification

Icon
Error

Options
Go to last post Go to first unread
ikejs  
#1 Posted : Tuesday, May 5, 2026 8:04:34 AM(UTC)
ikejs

Rank: Newbie

Groups: Registered
Joined: 5/5/2026(UTC)
Posts: 1
United States
Location: Wisconsin

Hi vMix team,

Requesting support for CSS backdrop-filter (and -webkit-backdrop-filter) in the Web Browser Input, so the blur applies to whatever vMix is rendering underneath — camera feed, program output, etc.


Use case: We do live sports streaming with a custom HTML scoreboard driven by our own control interface, overlaid on the game camera via a Web Browser Input with a transparent background. Works great — except our design uses frosted-glass panels with backdrop-filter: blur(...). In a normal browser the blur picks up the camera pixels behind the panel; in vMix, those panels render as flat semi-transparent rectangles with no blur. Everything else on the page (text, solid panels, transparency, animations) renders perfectly.

Why I think this happens: The Web Browser Input uses CEF in offscreen rendering mode. CEF renders the page to an isolated RGBA bitmap with a transparent background, and vMix composites that bitmap onto the video as a separate step. So when the browser computes the blur, it samples the pixels behind the panel from its own surface — which is empty/transparent. The camera feed only meets the page later in vMix's compositor, after rendering is done. The blur has no source pixels to read. Same limitation exists in OBS browser sources and other CEF-based overlay systems for the same reason — it's not a bug in CEF or our CSS, it's a consequence of how offscreen-rendered overlays work.


Possible approaches (you'll know better than I do what's tractable):

- Let the Web Browser Input optionally receive the underlying composited video as a texture the page can read (similar to how the Telestrator gets video into a browser context), so the page can explicitly blur it.
- Detect backdrop-filter elements and apply the blur on vMix's side during compositing, using the real underlying pixels — similar to how OS compositors handle "acrylic"/"vibrancy" effects.
- An opt-in mode where the browser input is composited against a designated background source before becoming an overlay, so blur (and mix-blend-mode, etc.) naturally has pixels to work with.

Any of these would unlock modern graphic design — frosted lower-thirds, blurred scoreboard panels, glassmorphism bugs — without users having to pre-bake effects elsewhere.

Happy to share a demo HTML page if it'd help reproduce.
Thanks for considering, and thanks for vMix!

Users browsing this topic
Guest
Forum Jump  
You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.