AI
Pass

How to Build an AI Object Remover with AI Pass SDK

Eiliya · February 25, 2026 · 2 min read · tutorial

Build an AI Object Remover with AI Pass SDK

Want to add AI-powered object removal to your app? This tutorial walks you through building one from scratch using the AI Pass SDK. Your users pay per use, and you earn 50% commission on every API call.

What You'll Build

A web app where users:

  1. Upload a photo
  2. Describe what to remove
  3. Get a cleaned-up image back

Prerequisites

Step 1: Set Up the SDK

<!DOCTYPE html>
<html>
<head>
  <title>AI Object Remover</title>
  <link href="https://aipass.one/aipass-ui.css" rel="stylesheet">
</head>
<body>
  <!-- Your app UI here -->

  <script src="https://aipass.one/aipass-sdk.js"></script>
  <script>
    AiPass.initialize({
      clientId: 'YOUR_CLIENT_ID',
      requireLogin: true,
      darkMode: true
    });
  </script>
</body>
</html>

requireLogin: true handles authentication automatically — the SDK shows a login screen when needed. No custom auth code required.

Get your Client ID: Go to Developer Dashboard → OAuth2 Clients → copy your Client ID (looks like client_xxxx...).

Step 2: Build the UI

Add an upload area and a text input for the removal instruction:

<div id="app">
  <h1>AI Object Remover</h1>
  <input type="file" id="imageInput" accept="image/*">
  <img id="preview" style="max-width:400px; display:none;">
  <input type="text" id="instruction" placeholder="Describe what to remove...">
  <button onclick="removeObject()">Remove Object</button>
  <img id="result" style="max-width:400px; display:none;">
</div>

Step 3: Implement Object Removal

The AI Pass SDK's editImage() method uses Gemini's image editing model:

async function removeObject() {
  const fileInput = document.getElementById('imageInput');
  const instruction = document.getElementById('instruction').value;
  
  if (!fileInput.files[0] || !instruction) {
    alert('Please upload an image and describe what to remove');
    return;
  }

  try {
    const result = await AiPass.editImage({
      image: fileInput.files[0],
      prompt: `Remove the following from this image: ${instruction}. Fill the area naturally with the surrounding background.`,
      model: 'gemini/gemini-3-pro-image-preview'
    });

    document.getElementById('result').src = result.data[0].url;
    document.getElementById('result').style.display = 'block';
  } catch (err) {
    console.error('Edit failed:', err);
    alert('Failed to process image. Please try again.');
  }
}

Step 4: Deploy

Option A: Self-host anywhere. The SDK handles billing — host on GitHub Pages, Netlify, Vercel, or your own server. Users authenticate through AI Pass and pay per use.

Option B: Publish on AI Pass catalog. Get a page at aipass.one/apps/your-app plus an embed/iframe feature via the </> button.

Revenue Model

Every time a user makes an API call through your app, AI Pass handles billing. You earn 50% commission on each call. Build once, earn passively.

Next Steps

Related Apps

object-remover bg-remover