---
base_model: google/owlvit-base-patch32
library_name: transformers.js
pipeline_tag: zero-shot-object-detection
---

https://huggingface.co/google/owlvit-base-patch32 with ONNX weights to be compatible with Transformers.js.


## Usage (Transformers.js)

If you haven't already, you can install the [Transformers.js](https://huggingface.co/docs/transformers.js) JavaScript library from [NPM](https://www.npmjs.com/package/@xenova/transformers) using:
```bash
npm i @xenova/transformers
```

**Example:** Zero-shot object detection w/ `Xenova/owlvit-base-patch32`.
```js
import { pipeline } from '@xenova/transformers';

const detector = await pipeline('zero-shot-object-detection', 'Xenova/owlvit-base-patch32');

const url = 'https://huggingface.co/datasets/Xenova/transformers.js-docs/resolve/main/astronaut.png';
const candidate_labels = ['human face', 'rocket', 'helmet', 'american flag'];
const output = await detector(url, candidate_labels);
// [
//   { score: 0.24392342567443848, label: 'human face', box: { xmin: 180, ymin: 67, xmax: 274, ymax: 175 } },
//   { score: 0.15129457414150238, label: 'american flag', box: { xmin: 0, ymin: 4, xmax: 106, ymax: 513 } },
//   { score: 0.13649864494800568, label: 'helmet', box: { xmin: 277, ymin: 337, xmax: 511, ymax: 511 } },
//   { score: 0.10262022167444229, label: 'rocket', box: { xmin: 352, ymin: -1, xmax: 463, ymax: 287 } }
// ]
```

![image/png](https://cdn-uploads.huggingface.co/production/uploads/61b253b7ac5ecaae3d1efe0c/rNLU-bl1_H0HrPgkPMhso.png)


**Example:** Zero-shot object detection w/ `Xenova/owlvit-base-patch32` (additional parameters).
```js
import { pipeline } from '@xenova/transformers';

const detector = await pipeline('zero-shot-object-detection', 'Xenova/owlvit-base-patch32');

const url = 'https://huggingface.co/datasets/Xenova/transformers.js-docs/resolve/main/beach.png';
const candidate_labels = ['hat', 'book', 'sunglasses', 'camera'];
const output = await detector(url, candidate_labels, { topk: 4, threshold: 0.05 });
// [
//   { score: 0.1606510728597641, label: 'sunglasses', box: { xmin: 347, ymin: 229, xmax: 429, ymax: 264 } },
//   { score: 0.08935828506946564, label: 'hat', box: { xmin: 38, ymin: 174, xmax: 258, ymax: 364 } },
//   { score: 0.08530698716640472, label: 'camera', box: { xmin: 187, ymin: 350, xmax: 260, ymax: 411 } },
//   { score: 0.08349756896495819, label: 'book', box: { xmin: 261, ymin: 280, xmax: 494, ymax: 425 } }
// ]
```


![image/png](https://cdn-uploads.huggingface.co/production/uploads/61b253b7ac5ecaae3d1efe0c/OKHu5M0RcAlwPkydxBZyB.png)

---


Note: Having a separate repo for ONNX weights is intended to be a temporary solution until WebML gains more traction. If you would like to make your models web-ready, we recommend converting to ONNX using [🤗 Optimum](https://huggingface.co/docs/optimum/index) and structuring your repo like this one (with ONNX weights located in a subfolder named `onnx`).