Transformers
Image-to-Image
Super resolution and image enhancement with Swin2SR.
Enhance images using super resolution models. Upscale low-resolution images to higher quality directly in the browser.
For full API reference (imageToImage(), options, result types, and custom providers), see the Core Vision guide.
See it in action
Run it in the Image Enhancer block — an installable, registry-composed version with 2x, 4x, and real-world Restore modes.
Recommended Models
| Model | Size | Scale | Use Case |
|---|---|---|---|
Xenova/swin2SR-lightweight-x2-64 | ~50MB | 2x | Lightweight 2x upscaling (recommended) |
Xenova/swin2SR-classical-sr-x4-64 | ~50MB | 4x | Higher quality 4x upscaling |
Photo Enhancer Example
Based on the Image Enhancer block:
import { transformers } from '@localmode/transformers';
import { imageToImage } from '@localmode/core';
const model = transformers.imageToImage('Xenova/swin2SR-lightweight-x2-64');
async function enhancePhoto(imageDataUrl: string) {
const { image } = await imageToImage({
model,
image: imageDataUrl,
abortSignal: controller.signal,
});
// Convert Blob to data URL for display
const reader = new FileReader();
return new Promise<string>((resolve) => {
reader.onload = () => resolve(reader.result as string);
reader.readAsDataURL(image);
});
}Best Practices
Super Resolution Tips
- 2x upscaling — The lightweight model doubles image dimensions
- Input size matters — Very large images will be slow; resize input if needed
- Output is a Blob — Use
URL.createObjectURL()orFileReaderto display - Support cancellation — Super resolution can take several seconds
Performance Note
Super resolution is computationally intensive. Processing time increases with input image size. For best results, keep input images under 1024x1024 pixels.
Composed Block
| Block | Description | Links |
|---|---|---|
| Image Enhancer | Swin2SR super-resolution with 2x, 4x, and real-world Restore modes | Live · Install: npx shadcn add @localmode/ui/blocks/image-studio/image-enhancer |