BackDrop - Text Behind Image

🖼️ Results

Before	After

---

🔗 Live Demos

• 🌐 Remove.bg API Version (Vercel) — Live Demo
• ☁️ U²-Net Model Version (AWS Elastic Beanstalk) — Live Demo

---

🧠 Project Overview

BackDrop is a web-based tool that allows users to create visually appealing text effects by placing text behind an image.
It enhances aesthetics for web and design projects by automating background removal and providing interactive customization tools.

The project includes two versions:

1. U²-Net Model (AI Inference on AWS)

   • Uses a deep learning model (U²-Net) for background removal.
   • Hosted on AWS Elastic Beanstalk for scalable and cost-efficient deployment.
   • Ideal for offline/local inference without third-party API limits.

2. Remove.bg API Version (Cloud API)

   • Uses the external remove.bg API for quick, cloud-based background removal.
   • Hosted on Vercel for seamless frontend-backend integration.

---

📦 Features

• Upload and edit images (PNG, JPG, JPEG, WEBP, GIF, BMP supported)
• AI-based background removal via:
  • 🧠 U²-Net Model (Local AI on AWS)
  • ☁️ Remove.bg API (External Cloud Service)
• Add and customize text behind the image
• Adjust text font, size, color, opacity, rotation, shadow, and gradients
• Real-time canvas rendering with instant visual feedback

---

🚀 Tech Stack

Component	Technology Used
Frontend	HTML, JavaScript, Tailwind CSS
Backend (U²-Net Version)	Flask, PyTorch (U²-Net Model), AWS Elastic Beanstalk
Backend (API Version)	Flask, remove.bg API, Vercel
Hosting	AWS Elastic Beanstalk (AI Version), Vercel (API Version)

---

📸 Screenshots

---

⚙️ Installation

1. Clone the repository

git clone https://github.com/vinyashegde/backdrop-text-behind-image.git
cd backdrop-text-behind-image