Exporting

Export the edited image in various formats.

Preview (Canvas)

const canvas = await editor.preview();
document.body.appendChild(canvas);

Note: preview never includes watermark, even in trial mode.

To Blob

const blob = await editor.toBlob(
  format?: 'image/jpeg' | 'image/png' | 'image/webp',
  quality?: number  // 0-1 for JPEG/WebP
);

// Upload example
const formData = new FormData();
formData.append('image', blob, 'edited.jpg');
await fetch('/upload', { method: 'POST', body: formData });

To Data URL

const dataURL = await editor.toDataURL('image/jpeg', 0.9);
document.getElementById('result').src = dataURL;

Download

// Download as JPEG with 90% quality
await editor.download('my-photo.jpg', 'image/jpeg', 0.9);

// Download as PNG (lossless)
await editor.download('my-photo.png', 'image/png');

// Download as WebP with 85% quality
await editor.download('my-photo.webp', 'image/webp', 0.85);

Format Comparison

FormatCompressionTransparencyBest For
JPEGLossyNoPhotos
PNGLosslessYesGraphics, screenshots
WebPBothYesWeb (smaller files)