markfulton/NanoBananaEditor

What it solves

Nano Banana Editor provides a unified interface for generating and editing images using Google's Gemini image models. It simplifies the process of creating high-quality visuals by combining prompt-based generation, reference image support, and precise local editing tools in a single application.

How it works

Built with React and TypeScript, the app connects to Gemini image models via Supabase edge functions. Users can generate images from text, use reference photos, and apply masks to specific regions for targeted edits. The system supports multi-turn edits where follow-up requests maintain context from previous turns. It also integrates search grounding to ensure prompts are based on real-world facts and offers "thinking control" (Fast vs. Deep) for Flash models to balance speed and layout complexity.

Who it’s for

It is designed for users who want a professional-grade image generation workflow, ranging from creating 512px drafts to 4K final renders, with the ability to self-host the editor and manage their own API keys or credit systems.

Highlights

• Advanced Editing: Supports masking with a brush and eraser for local changes and multi-turn conversational editing.
• Search Grounding: Integrates live search results to ground prompts in real-world data like weather or product info.
• Model Flexibility: Supports multiple Gemini models (Lite, Flash, Pro) with varying resolutions (up to 4K) and aspect ratios.
• Local History: Saves renders to IndexedDB, allowing users to branch from previous versions and track request details.
• Self-Hosting Ready: Includes a full guide for deployment with Supabase and optional Stripe integration for selling credits.