Vibe Canvas

Simplified Chinese | English

Let Codex conversations grow into a filterable thinking canvas on the right side in real time.

Introduction

Vibe Canvas is a local-first Codex plugin. You continue chatting with Codex normally on the left, and the Browser on the right automatically displays three layers of content:

• The verbatim conversation transcript

• AI-summarized structured understanding

• A continuously growing mind map as the conversation progresses

It is not a standalone website that requires you to input again, send again, or manually save. The HTML page is just a real-time projection view on the right side of Codex; input, understanding, and reasoning still happen within the current Codex task.

Ideal for brainstorming, solution exploration, study notes, retrospectives, requirement analysis, and any thinking process that benefits from "seeing structure while chatting."

Related MCP server: repo-memory-mcp

Features

• Conversation as input: The left Codex is the only text entry point; there is no second input box inside the canvas.

• Original text traceable: Every user input is preserved verbatim; AI rewrites are not presented as the original.

• AI auto-pick: New content is classified as picked, candidate, or ignored.

• Candidate buffer: Content that cannot be determined immediately waits for subsequent context, not rushed into the structure.

• Human final decision: Each turn has a Pick Checkbox; human selection always overrides later AI judgments.

• Real-time restructuring: When a Pick is removed, the corresponding content immediately exits the structure and mind map without calling the model again.

• Local-first: Session and theme preferences are saved in the .local/ directory of the current workspace.

• Dual themes: The bright blue default theme and a warm theme can be toggled instantly with preference remembered.

• Incremental sync: Each turn only reads the compact projection and writes the current increment, avoiding repeated replay of the entire conversation.

Screenshots

Pick Selected and Unselected

Left side shows green selected state, right side shows gray unselected state; removing the pick updates the structure and mind map synchronously.

Requirements

• Codex Desktop, with support for local Plugin, Skill, MCP Server, and right-side Browser

• Node.js 20 or higher

• A working codex CLI

Current version developed and verified on macOS.

Installation

Register the GitHub repository directly as a Codex Marketplace, then install the plugin from it:

codex plugin marketplace add prozacLaputa/vibe-canvas
codex plugin add vibe-canvas@vibe-canvas --json

Confirm installation status:

codex plugin list --json

After installation or upgrade, it is recommended to create a new Codex task to let the Skill and MCP tools rediscover.

Usage

In a new Codex task, enter:

使用 $vibe-canvas 打开一个思考画板

Then chat normally:

1. Codex opens Vibe Canvas on the right side.

2. Before each response, the current conversation syncs the original text and structural increment of that turn to the canvas.

3. The AI automatically selects explicitly valuable content, placing uncertain content into the candidate buffer.

4. You can click Pick in the original text area to decide at any time whether a turn enters the structure and mind map.

5. The Switch in the top right corner toggles between blue and warm themes.

The canvas activation scope is limited to the current Codex task; ordinary tasks are not automatically taken over.

How It Works

flowchart LR
    U[左侧正常对话] --> C[当前 Codex 任务]
    C -->|读取紧凑投影| M[本地 MCP Server]
    C -->|写入本轮原文与结构增量| M
    M --> J[本地 Session JSON]
    J -->|revision 变化| B[右侧 Browser 投影]
    B -->|Pick / 主题 PATCH| J

The core consists of three parts:

1. Skill handles timing and constraints: After explicit activation, each turn reads the compact context via vibe_canvas_get_projection and writes the current increment via vibe_canvas_sync_turn. It does not start a second Codex session or fake user messages.

2. MCP Server handles state: A Node.js process provides both MCP tools and a local HTTP API listening only on 127.0.0.1, persisting the session as JSON.

3. Browser handles projection and filtering: The page checks the internal revision approximately every 900 ms and only re-renders when the state changes. Pick and theme switching go directly through local HTTP, no model calls, no extra tokens consumed.

Tokens mainly come from one compact structure read and one small incremental write per turn; browser polling, theme switching, and manual picks are all local operations.

Default data location:

<workspace>/.local/vibe-canvas-demo/sessions/<session-id>.json
<workspace>/.local/vibe-canvas-demo/preferences.json

Shortcuts

No additional shortcuts currently; use the Codex conversation and the Pick / theme controls in the canvas.

Development

npm test

Tests cover opening the canvas, incremental sync, AI pick, candidate re-evaluation, human override, theme preference, and state restoration via public MCP JSON-RPC and local HTTP projection API.

Changelog

See CHANGELOG.md.

License

MIT © 2026 prozacLaputa