# Replace the background in React Native

> Replace the React Native camera background with a color, local image, or local video through the Nosmai API.

> For AI agents: the complete documentation index is at https://nosmai.com/llms/effects.txt

Product: Nosmai Effects
Group: guide
Source: https://nosmai.com/docs/effects/guides/background/replace-the-background/react-native/

## Prerequisites

- A working [React Native quickstart](/docs/effects/quickstart/react-native/)
- Advanced filters enabled
- A readable absolute local `file://` URI

## Apply an image

```tsx
if (await NosmaiCameraSdk.isAdvancedFiltersEnabled()) {
  await NosmaiCameraSdk.setBackground({
    mode: 'image',
    uri: localImageFileUri,
  });
}
```

Use `mode: 'color'` with normalized RGBA values, or `mode: 'video'` with a
local video URI.

Portable image formats are JPEG, PNG, and WebP. Portable video formats are
MP4, M4V, and MOV. Do not pass a Metro asset number, remote URL, query, or
fragment.

## Clear it

```tsx
await NosmaiCameraSdk.clearBackground();
```

This clears manual segmentation. It does not remove an authored background
package.

## Verify it worked

The native preview should update without remounting `NosmaiCameraView`. Test
both native platforms in Release builds.

## Common errors

| Error | Cause | Fix |
| --- | --- | --- |
| `E_BACKGROUND_RESOURCE` | URI is unreadable or format is unsupported | Copy to a local file and use a supported extension |
| No visible result | Preview is not ready or capability is disabled | Wait for `onReady` and check `isAdvancedFiltersEnabled` |
| Memory rises after repeated videos | Previous resources are retained by application state | Clear the background and release temporary files when finished |

## Next steps

- [Blur the background in React Native](/docs/effects/guides/background/blur-the-background/react-native/)
- [Capture a photo in React Native](/docs/effects/guides/output/capture-a-photo/react-native/)
- [Review React Native support](/docs/effects/platforms/react-native/)

## References

- [React Native quickstart](/docs/effects/quickstart/react-native/)
- [Platform support](/docs/effects/platform-support/)