gitmyhub

image-extender

TypeScript ★ 1.1k updated 1mo ago

Seamlessly extend any image in any direction with AI. Open-source web app powered by Gemini via OpenRouter, with Poisson-blended seams and best-of-3 variant picker.

A web app that uses AI to extend photos and artwork beyond their edges, plus four toolsets for generating consistent backgrounds, tiles, sprites, and props for 2D games.

Next.jsTypeScriptGeminiOpenRoutersetup: easycomplexity 2/5

Image Extender is an open-source web application that uses AI to expand photographs and artwork beyond their original borders. The core feature is called outpainting: you upload an image, click an edge, and the AI generates new content that continues the scene naturally in that direction. A square photo can become a wide cinematic frame. The app includes a technique called Poisson blending that mathematically smooths the join between the original image and the AI-generated addition so the seam becomes invisible.

Beyond single image extension, the app includes four additional workspaces aimed at 2D game developers. Parallax Studio lets you build multi-layered scrolling backgrounds, the kind found in side-scrolling games where the background moves at a different speed than the foreground. Each depth layer (sky, far distance, midground, near foreground) is generated and extended separately, then bundled into a ZIP file with a manifest that game engines like Unity, Godot, or Phaser can use directly. Tile Studio generates a complete set of 13 interlocking tiles for platform games in a single AI call, keeping colors and textures consistent across the whole set. Sprite Studio generates character animation frames as a sheet of keyframes, with a live preview that plays the animation back. Props Studio creates batches of transparent decoration images, the kind layered on top of a tile map to add detail to a scene.

The app is powered by Google's Gemini image models, accessed through a service called OpenRouter. You supply your own OpenRouter API key, which stays stored only in your browser and is never saved on the server. You can choose between different Gemini model variants depending on the speed and quality tradeoff you want.

Every workspace shares a "scene brief" generated from your initial prompt, covering setting, time of day, color palette, and mood. This brief is reused when generating tiles, sprites, and props so all the assets for a project stay visually consistent with each other.

The project is built with Next.js and TypeScript and is available to self-host or run locally with your own API key.

Where it fits