Skip to content
Service

AI Effects

Background blur and virtual backgrounds, applied on-device to the camera track before it's published — private, no server round-trip.

Tip:Available in the Web / React Native SDK today (runs in the browser via WebGL/WASM). The Flutter build is on the roadmap.

Install

terminal
1npm i @socrits/client @livekit/track-processors

Apply effects

Effects wrap the camera track with a processor, so they work with both the raw room and the prebuilt UI. Toggle them any time during a call:

effects.ts
1import { applyBackgroundBlur, applyVirtualBackground, clearVideoEffects } from "@socrits/client";23// after the call is connected (you have the LiveKit `room`):4await applyBackgroundBlur(room, 10);                 // radius 0–205await applyVirtualBackground(room, "/bg/office.jpg"); // replace the background6await clearVideoEffects(room);                        // back to raw camera

Notes

Processing is entirely client-side — the blurred/replaced frames are what get published, so the raw background never leaves the device. Effects are billed under the AI Effects package (see the console).