> ## Documentation Index
> Fetch the complete documentation index at: https://www.cometchat.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Virtual Background

> CometChat Calling SDK v5 - Virtual Background for JavaScript

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:

```javascript theme={null}
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:

```javascript theme={null}
CometChatCalls.setVirtualBackgroundImage("https://example.com/background.jpg");
```

| Parameter  | Type   | Description                 |
| ---------- | ------ | --------------------------- |
| `imageUrl` | String | URL of the background image |

<Note>
  The image URL must be accessible from the user's browser. Consider hosting images on a CDN for best performance.
</Note>

## Clear Virtual Background

Remove any applied virtual background:

```javascript theme={null}
CometChatCalls.clearVirtualBackground();
```

## Virtual Background Dialog

### Show Dialog

Open the built-in virtual background settings dialog:

```javascript theme={null}
CometChatCalls.showVirtualBackgroundDialog();
```

### Hide Dialog

Close the virtual background dialog:

```javascript theme={null}
CometChatCalls.hideVirtualBackgroundDialog();
```

## Hide Virtual Background Button

To hide the virtual background button from the control panel:

```javascript theme={null}
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

### Browser Compatibility

| Platform                        | Browser                     | Supported       |
| ------------------------------- | --------------------------- | --------------- |
| Desktop (Windows, macOS, Linux) | Chrome                      | ✅ Yes           |
| Desktop (Windows, macOS, Linux) | Firefox                     | ✅ Yes           |
| Desktop                         | Safari, Edge, others        | ❌ Not supported |
| iOS (iPhone, iPad)              | Safari, Chrome, any browser | ❌ Not supported |
| Android                         | Chrome                      | ❌ Not supported |

<Warning>
  Virtual background is **only supported on desktop Chrome and Firefox**. All browsers on iOS use WKWebView under the hood, which does not provide the APIs required for real-time background segmentation.
</Warning>

For best results, use desktop Chrome or Firefox on a device with adequate processing power.