Virtual Try-On

Generate realistic virtual try-on images by applying garments, eyewear, footwear, and other products onto a person's image using YourMirror.io integration.

Overview

The Virtual Try-On feature allows you to:

• Apply virtual garments (tops, bottoms, dresses) onto a person
• Try on eyewear and footwear
• Use optional masks for precise placement
• Choose between normal and high quality outputs

Usage

JSON Request

const result = await client.images.tryOn.json({
  base_image: "https://example.com/person.jpg", // Person image URL
  product_image: "https://example.com/dress.jpg", // Product to try on
  workflow_type: "dress", // Type of product
  quality: "high" // Optional: "normal" or "high"
});

console.log("Try-on result:", result.data.imageUrl);

FormData Request (with files)

// Browser
const baseFile = document.getElementById('personImage').files[0];
const productFile = document.getElementById('productImage').files[0];

const result = await client.images.tryOn.formData({
  base_file: baseFile,
  product_file: productFile,
  workflow_type: "top",
  quality: "normal"
});

// Node.js
const fs = require('fs');

const baseBuffer = fs.readFileSync('./person.jpg');
const productBuffer = fs.readFileSync('./shirt.jpg');

const result = await client.images.tryOn.formData({
  base_file: baseBuffer,
  product_file: productBuffer,
  workflow_type: "top",
  quality: "high"
});

With Mask for Precise Placement

const result = await client.images.tryOn.json({
  base_image: "https://example.com/person.jpg",
  product_image: "https://example.com/glasses.jpg",
  workflow_type: "eyewear",
  mask_image: "https://example.com/face-mask.png", // Optional mask
  quality: "high"
});

Check Try-On Status

// Get the status of a try-on operation
const status = await client.images.tryOn.getStatus(result.data.runId);

console.log("Status:", status.data.status);
console.log("Progress:", status.data.progress);
if (status.data.imageUrl) {
  console.log("Result image:", status.data.imageUrl);
}

Parameters

Required Parameters

Parameter	Type	Description
base_image or base_file	string/File/Buffer	The person's image (URL, base64, database ID, or file)
product_image or product_file	string/File/Buffer	The product to try on (URL, base64, database ID, or file)
workflow_type	string	Type of product: "eyewear", "footwear", "dress", "bottom", "top"

Optional Parameters

Parameter	Type	Description
mask_image or mask_file	string/File/Buffer	Optional mask for precise placement
quality	string	Output quality: "normal" (default) or "high"

Workflow Types

• eyewear: Virtual glasses, sunglasses
• footwear: Shoes, boots, sandals
• dress: Full dresses
• bottom: Pants, skirts, shorts
• top: Shirts, blouses, jackets

Response Format

{
  success: boolean;
  message: string;
  data: {
    runId: string;        // Unique identifier for the try-on operation
    status: string;       // Current status (processing, completed, failed)
    imageUrl?: string;    // URL of the generated try-on image (when completed)
    progress?: number;    // Progress percentage (0-100)
  };
  code?: string;         // Error code if applicable
  details?: any;         // Additional error details
}

Examples

Try on a Dress

const result = await client.images.tryOn.json({
  base_image: "user_profile_123", // Using a database ID
  product_image: "https://store.com/dress-001.jpg",
  workflow_type: "dress",
  quality: "high"
});

Try on Eyewear with Mask

const result = await client.images.tryOn.formData({
  base_file: personImageFile,
  product_file: sunglassesFile,
  mask_file: faceMaskFile, // Ensures glasses are placed correctly
  workflow_type: "eyewear",
  quality: "high"
});

Try on Multiple Items Sequentially

// Try on a top
const topResult = await client.images.tryOn.json({
  base_image: originalPersonUrl,
  product_image: shirtUrl,
  workflow_type: "top"
});

// Then try on bottom using the result
const completeOutfit = await client.images.tryOn.json({
  base_image: topResult.data.imageUrl,
  product_image: pantsUrl,
  workflow_type: "bottom"
});

Error Handling

try {
  const result = await client.images.tryOn.json({
    base_image: personUrl,
    product_image: productUrl,
    workflow_type: "top"
  });
  
  if (result.success) {
    console.log("Try-on successful:", result.data.imageUrl);
  } else {
    console.error("Try-on failed:", result.message);
  }
} catch (error) {
  console.error("Error during try-on:", error.message);
}

Best Practices

1. Image Quality: Use high-resolution images for better results
2. Image Format: Person should be clearly visible, preferably standing
3. Product Images: Use product images with clean backgrounds
4. Masks: Use masks for accessories like eyewear for better placement
5. Quality Setting: Use "high" quality for production, "normal" for previews

Limitations

• Maximum file size: 10MB per image
• Supported formats: JPEG, PNG, WebP
• Processing time varies based on quality setting
• Best results with front-facing person images

Related Methods

• Image Generation - Generate images from text
• Image Editing - Edit existing images with Flux Kontext
• Character Generation - Generate character-based images