@imgly/background-removal

Background Removal in the Web Browser

Getting Started

npm install @imgly/background-removal

or

yarn add @imgly/background-removal

Usage

import imgly_bg_remove from `@imgly/background-removal`

let image_src: ImageData | ArrayBuffer | Uint8Array | Blob | URL | string = ...;

imgly_bg_remove(image_src).then((blob: Blob) => {
  // result is a blob encoded as PNG.
  // It can be converted to an URL to be used as HTMLImage.src
  const url = URL.createObjectURL(blob);
})

Custom deployment

Currently, the wasm and onnx neural networks are served via unpkg. For production use, we advise to host them yourself. Therefore, copy all .wasm and .onnx files to your public path and reconfigure the library

cp node_modules/@imgly/background-removal/dist/*.wasm $PUBLIC_PATH
cp node_modules/@imgly/background-removal/dist/*.onnx $PUBLIC_PATH

import imgly_bg_remove, {Config} from `@imgly/background-removal`

const public_path = ... ; // the path assets are served from

let config: Config =  { 
  wasmPath: public_path, // path to the wasm files
  modelPath: public_path 
};

let image_src: ImageData | ArrayBuffer | Uint8Array | Blob | URL | string = ...;

imgly_bg_remove(image_src, config).then((blob: Blob) => {
  // result is a blob encoded as PNG.
  // It can be converted to an URL to be used as HTMLImage.src
  const url = URL.createObjectURL(blob);
})