Apply virtual backgrounds to your video feed during calls. You can blur your background or replace it with a custom image.
Background Blur
Apply a blur effect to your background:
CometChatCalls.setVirtualBackgroundBlurLevel(10);
| Parameter | Type | Description |
|---|
blurLevel | Number | The blur intensity level (higher = more blur) |
Custom Background Image
Set a custom image as your virtual background:
CometChatCalls.setVirtualBackgroundImage("https://example.com/background.jpg");
| Parameter | Type | Description |
|---|
imageUrl | String | URL of the background image |
The image URL must be accessible from the user’s browser. Consider hosting images on a CDN for best performance.
Clear Virtual Background
Remove any applied virtual background:
CometChatCalls.clearVirtualBackground();
Virtual Background Dialog
Show Dialog
Open the built-in virtual background settings dialog:
CometChatCalls.showVirtualBackgroundDialog();
Hide Dialog
Close the virtual background dialog:
CometChatCalls.hideVirtualBackgroundDialog();
const callSettings = {
hideVirtualBackgroundButton: true,
// ... other settings
};
Browser Requirements
Virtual backgrounds use machine learning for background segmentation. Performance may vary based on:
- Device processing power
- Browser version
- Camera resolution
For best results, use a modern browser on a device with adequate processing power. 
