GPT Image Canvas

English | 简体中文

Local professional AI canvas built with tldraw, Hono, SQLite, and GPT Image 2. Version v0.2.0 adds a credential-aware homepage, Codex device login fallback, and the existing Tencent Cloud COS backup / OpenAI-compatible image response support.

Preview

Highlights

• AI canvas powered by tldraw with prompt-to-image and reference-image generation.
• Local-first storage for generated images and project snapshots.
• Optional Tencent Cloud COS backup for newly generated images.
• Generation history with locate, rerun, download, and cloud upload status.
• OpenAI-compatible image endpoint support, including PackyCode / gpt-image style responses.
• Credential-aware routes with a global provider configuration dialog, API-key priority, local API storage, and optional Codex login fallback.

Requirements

• Node.js 22 or newer.
• pnpm 9.14.2. The package manager is pinned in package.json; Corepack can activate it with corepack prepare pnpm@9.14.2 --activate.
• Docker Desktop or a compatible Docker Engine for the Docker workflow.
• An OpenAI API key with access to gpt-image-2, or a Codex login completed from the app, for live generation. The app can boot without credentials and will show the homepage until a provider is available.

Quick Start

Windows PowerShell:

pnpm install
Copy-Item .env.example .env
pnpm dev

macOS/Linux:

pnpm install
cp .env.example .env
pnpm dev

For API-key based live generation, set OPENAI_API_KEY in .env or open the top-right 配置 dialog in the app and save one local OpenAI-compatible API configuration. The app uses the official OpenAI Image API with gpt-image-2 by default. To route requests through an OpenAI-compatible endpoint, set OPENAI_BASE_URL in .env or enter a local Base URL in the dialog; to use a different compatible image model, set OPENAI_IMAGE_MODEL or the dialog's advanced model field.

Open the web app at `

Authentication And Routes

• / is the credential-aware homepage. If neither OPENAI_API_KEY nor a valid Codex session is available, it presents the project overview with two actions: Codex 登录 and 接入 API.
• /canvas is the working canvas. When no generation provider is available, the app routes users back to /; when a provider is available, / routes into /canvas.
• /gallery remains accessible in all credential states so locally saved work can still be viewed.
• The top-right 配置 button is available from Home, Canvas, and Gallery. It shows provider priority and source details for environment OpenAI, local OpenAI-compatible API, and Codex.
• Provider priority defaults to environment OpenAI, local OpenAI, then Codex, and can be reordered in the dialog. Fallback only happens before a request is created when a higher-priority source is empty or unavailable.
• Environment values remain read-only. The dialog masks OPENAI_API_KEY, shows Base URL, model, timeout, and remin