Update README.md

README.md

@@ -4,4 +4,50 @@ library_name: transformers.js
 
 https://huggingface.co/caidas/swin2SR-realworld-sr-x4-64-bsrgan-psnr 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:** Upscale an image with `Xenova/swin2SR-realworld-sr-x4-64-bsrgan-psnr`.
+```js
+import { pipeline } from '@xenova/transformers';
+
+// Create image-to-image pipeline
+const upscaler = await pipeline('image-to-image', 'Xenova/swin2SR-realworld-sr-x4-64-bsrgan-psnr', {
+    // quantized: false, // Uncomment this line to use the quantized version
+});
+
+// Upscale an image
+const url = 'https://huggingface.co/datasets/Xenova/transformers.js-docs/resolve/main/butterfly.jpg';
+const output = await upscaler(url);
+// RawImage {
+//   data: Uint8Array(3145728) [ ... ],
+//   width: 1024,
+//   height: 1024,
+//   channels: 3
+// }
+
+// (Optional) Save the upscaled image
+output.save('upscaled.png');
+```
+
+<details>
+  <summary>See example output</summary>
+
+  Input image:
+  
+  ![image/png](https://cdn-uploads.huggingface.co/production/uploads/61b253b7ac5ecaae3d1efe0c/eqLyvsErNQvXAFDD2MylF.png)
+
+  
+  Output image:
+
+  ![image/png](https://cdn-uploads.huggingface.co/production/uploads/61b253b7ac5ecaae3d1efe0c/_yYB-1NRfobL2wWMIcy3k.png)
+
+</details>
+
+---
+
 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`).