Thumbai brings fast, configurable AI thumbnail generation directly inside your GrapesJS editor. Create high-quality thumbnails from text prompts or reference images, then replace any image on the canvas with a single click. Ideal for product pages, portfolios, ecommerce listings, marketing sites, and dynamic content creation workflows.

Please create an account at https://thumb.onl/ and copy your API key to use with the plugin.

✨ Features

AI Thumbnail Generation
Generate clean, optimized thumbnails from text prompts or uploaded reference images.
Instant On-Canvas Replacement
Select any image component and swap it with an AI-generated thumbnail instantly.
Resolution & Aspect Controls
Output precise sizes (e.g., 512×512, 1024×1024) and aspect ratios (1:1, 16:9, 4:5, etc.).
Editor Integration
Includes a dedicated Thumbai block plus an image toolbar button for quick access.
Programmatic API
Run generation, replacement, batch processing, or custom automations through commands and methods.
Events & Progress Hooks
Listen to lifecycle events — start, progress, success, fail — for UI reactions, loaders, or logs.
Secure Backend Setup
Use your own AI provider endpoint and keep keys server-side via proxies or custom integrations.

🚀 How It Works

Thumbai sends a prompt (and optional source image) to your configured AI image-generation endpoint. When the generated thumbnail is ready, the plugin automatically updates the selected component’s src attribute. Use the built-in UI for quick edits, or integrate programmatically for workflows like bulk thumbnail creation or automated page generation.

grapesjs ai

ThumbAI — AI-Powered Thumbnail Generator for GrapesJS

Related blog posts