Overture

Name: Overture
Author: SixHq

Warning

Overture is an open-source, locally running web interface delivered as an MCP (Model Context Protocol) server that visually maps out the execution plan of any AI coding agent as an interactive flowchart/graph before the agent begins writing code.

625stars

60forks

TypeScript

Added 2/24/2026

View on GitHub Download ZIP Scan for vulnerabilities

Requires a passing catalog security scan. Resolve the flagged issues and resubmit to enable featuring.

AI Agentsai-agentai-codingautomationclaudeclaude-codecodexcopilotcursordeepseekdeveloper-toolsgeminigenerative-aigptllmmcpmcp-serveropenclawplanningtypescriptvscode

Installation

# Add to your Claude Code skills
git clone https://github.com/SixHq/Overture

Getting Started

Guides for using ai agents skills like Overture.

Security ReportWarning

Last scanned: 5/11/2026

{
  "issues": [
    {
      "type": "npm-audit",
      "message": "@hono/node-server: @hono/node-server has authorization bypass for protected static paths via encoded slashes in Serve Static Middleware",
      "severity": "high"
    },
    {
      "type": "npm-audit",
      "message": "@typescript-eslint/eslint-plugin: Vulnerability found",
      "severity": "high"
    },
    {
      "type": "npm-audit",
      "message": "@typescript-eslint/parser: Vulnerability found",
      "severity": "high"
    },
    {
      "type": "npm-audit",
      "message": "@typescript-eslint/type-utils: Vulnerability found",
      "severity": "high"
    },
    {
      "type": "npm-audit",
      "message": "@typescript-eslint/typescript-estree: Vulnerability found",
      "severity": "high"
    },
    {
      "type": "npm-audit",
      "message": "@typescript-eslint/utils: Vulnerability found",
      "severity": "high"
    },
    {
      "type": "npm-audit",
      "message": "ajv: ajv has ReDoS when using `$data` option",
      "severity": "medium"
    },
    {
      "type": "npm-audit",
      "message": "brace-expansion: brace-expansion: Zero-step sequence causes process hang and memory exhaustion",
      "severity": "medium"
    },
    {
      "type": "npm-audit",
      "message": "dompurify: DOMPurify contains a Cross-site Scripting vulnerability",
      "severity": "medium"
    },
    {
      "type": "npm-audit",
      "message": "esbuild: esbuild enables any website to send any requests to the development server and read the response",
      "severity": "medium"
    },
    {
      "type": "npm-audit",
      "message": "express-rate-limit: express-rate-limit: IPv4-mapped IPv6 addresses bypass per-client rate limiting on servers with dual-stack network",
      "severity": "high"
    },
    {
      "type": "npm-audit",
      "message": "fast-uri: fast-uri vulnerable to path traversal via percent-encoded dot segments",
      "severity": "high"
    },
    {
      "type": "npm-audit",
      "message": "flatted: flatted vulnerable to unbounded recursion DoS in parse() revive phase",
      "severity": "high"
    },
    {
      "type": "npm-audit",
      "message": "hono: Hono added timing comparison hardening in basicAuth and bearerAuth",
      "severity": "high"
    },
    {
      "type": "npm-audit",
      "message": "ip-address: ip-address has XSS in Address6 HTML-emitting methods",
      "severity": "medium"
    },
    {
      "type": "npm-audit",
      "message": "lodash: lodash vulnerable to Code Injection via `_.template` imports key names",
      "severity": "high"
    },
    {
      "type": "npm-audit",
      "message": "minimatch: minimatch has a ReDoS via repeated wildcards with non-matching literal in pattern",
      "severity": "high"
    },
    {
      "type": "npm-audit",
      "message": "monaco-editor: Vulnerability found",
      "severity": "medium"
    },
    {
      "type": "npm-audit",
      "message": "path-to-regexp: path-to-regexp vulnerable to Regular Expression Denial of Service via multiple route parameters",
      "severity": "high"
    },
    {
      "type": "npm-audit",
      "message": "picomatch: Picomatch: Method Injection in POSIX Character Classes causes incorrect Glob Matching",
      "severity": "high"
    },
    {
      "type": "npm-audit",
      "message": "postcss: PostCSS has XSS via Unescaped </style> in its CSS Stringify Output",
      "severity": "medium"
    },
    {
      "type": "npm-audit",
      "message": "rollup: Rollup 4 has Arbitrary File Write via Path Traversal",
      "severity": "high"
    },
    {
      "type": "npm-audit",
      "message": "vite: Vite Vulnerable to Path Traversal in Optimized Deps `.map` Handling",
      "severity": "medium"
    }
  ],
  "status": "WARNING",
  "scannedAt": "2026-05-11T07:41:40.157Z",
  "semgrepRan": false,
  "npmAuditRan": true,
  "pipAuditRan": true
}

README.md

https://github.com/user-attachments/assets/eeb9c4cb-c80d-42da-bf63-c0c4ecb1e5d6

🔥 The Problem

Every AI coding agent today — Cursor, Claude Code, Cline, Copilot — works the same way:

What Happens Now

You type a prompt
Agent immediately starts writing code
You have zero visibility into what it's doing
You realize it misunderstood your request
Hundreds of lines of code need to be discarded
You've wasted tokens, time, and patience

Text Plans Don't Help

Some agents show plans as text in chat. But text fails to show:

Dependencies — which tasks depend on what?
Branch points — what alternative approaches exist?
Context requirements — which files, APIs, or secrets are needed?
Complexity — which steps are risky?
Progress — what's done, what's next?

✨ The Solution

Overture intercepts your AI agent's planning phase and renders it as an interactive visual flowchart — before any code is written.

The agent doesn't write a single line of code until you approve the plan.

🚀 Installation

Overture is an MCP server that works with any MCP-compatible AI coding agent. One command to install.

Claude Code

claude mcp add overture-mcp -- npx overture-mcp

Cursor

Add to ~/.cursor/mcp.json:

{
  "mcpServers": {
    "overture": {
      "command": "npx",
      "args": ["overture-mcp"]
    }
  }
}

Cline (VS Code Extension)

Open VS Code settings → search "Cline MCP" → add:

{
  "mcpServers": {
    "overture": {
      "command": "npx",
      "args": ["overture-mcp"]
    }
  }
}

GitHub Copilot

Create .vscode/mcp.json in your project root:

{
  "servers": {
    "overture": {
      "command": "npx",
      "args": ["overture-mcp"]
    }
  }
}

Note: GitHub Copilot MCP requires VS Code 1.99+ and uses servers instead of mcpServers.

Sixth AI (VS Code Extension)

Add to your Sixth AI MCP settings file:

Platform	Path
macOS	`~/Library/Application Support/Code/User/globalStorage/sixth.sixth-ai/settings/sixth-mcp-settings.json`
Windows	`%APPDATA%\Code\User\globalStorage\sixth.sixth-ai\settings\sixth-mcp-settings.json`
Linux	`~/.config/Code/User/globalStorage/sixth.sixth-ai/settings/sixth-mcp-settings.json`

{
  "mcpServers": {
    "overture": {
      "command": "npx",
      "args": ["overture-mcp"],
      "disabled": false
    }
  }
}

Global Installation (Optional)

npm install -g overture-mcp

Verify It Works

Give your agent any task. Overture automatically opens at http://localhost:3031 with your plan ready for approval.

🎯 How It Works

The Flow:

Step	What Happens
1. Prompt	You give your agent a task: "Build a REST API with auth"
2. Plan	Agent generates a detailed plan with steps, branches, and requirements
3. Visualize	Overture renders the plan as an interactive graph
4. Enrich	You click nodes, attach files, select branches, fill in API keys
5. Approve	You click "Approve & Execute" (or press Enter)
6. Execute	Watch real-time as nodes pulse, complete, or fail
7. Control	Pause (Spacebar), resume, re-run nodes, or modify the plan mid-flight

🛠 Features

Interactive Plan Canvas

Feature	Description
React Flow Canvas	Full pan, zoom, drag with smooth animations
Streaming Parser	Plan nodes appear in real-time as the agent generates them
Dagre Auto-Layout	Intelligent automatic positioning of nodes
Visual Status	Pending (gray) → Active (pulsing yellow) → Completed (green) / Failed (red)
Next Node Indicator	Blue pulse shows which node executes next
Complexity Badges	Low (green), Medium (yellow), High (red) at a glance
Glow Effects	Shadow glows highlight active and upcoming nodes
Insertable Edges	Hover over edges to insert new nodes mid-plan

Node Details Panel

Click any node to reveal its full details:

Info	What You See
Title & Description	Full context for what this step does
Complexity Level	Low / Medium / High with visual indicator
Expected Output	What the step should produce
Risks & Edge Cases	Potential issues to watch for
Pros & Cons	For branch options, compare trade-offs

Dynamic Fields (User Inputs)

Nodes can request input from you before execution:

Field Type	Use Case
String	Project names, URLs, custom values
Number	Port numbers, limits, counts
Boolean	Yes/No toggles for options
Select	Dropdown with predefined choices
Secret	API keys, tokens (masked input)
File	File paths to attach context

Each field includes:

Required/optional indicator
Default values
Help text & descriptions
Setup instructions ("How to get an API key")

File Attachments

Attach context files to specific nodes:

Automatic type detection — Image, code, document, or other
Visual icons per file type
Descriptions — add notes about why this file matters
Delete — remove unwanted attachments

Meta Instructions

Add custom LLM instructions to any node:

"Pay special attention to error handling here" "Use the existing auth pattern from src/auth.ts" "Make sure to add tests for edge cases"

Instructions are sent to the agent right before that node executes.

Branch Detection & Selection

Frequently Asked Questions

What is Overture?

Overture is an open-source ai agents skill for AI coding assistants such as Claude Code, Codex CLI, and ChatGPT, built by SixHq. Overture is an open-source, locally running web interface delivered as an MCP (Model Context Protocol) server that visually maps out the execution plan of any AI coding agent as an interactive flowchart/graph before the agent begins writing code. It has 625 GitHub stars.

Is Overture safe to use?

Overture returned warnings in SkillsLLM's automated security scan. It has no critical vulnerabilities, but review the flagged issues in the Security Report section before adding it to your workflow.

How do I install Overture?

Clone the repository with "git clone https://github.com/SixHq/Overture" and add it to your Claude Code skills directory (see the Installation section above).

What programming language is Overture written in?

Overture is primarily written in TypeScript. It is open-source under SixHq on GitHub, so you can review or fork the full source.

Are there alternatives to Overture?

Yes. SkillsLLM lists many other AI Agents skills you can browse and compare side by side. Open the AI Agents category from the badge at the top of this page, or use the Related Skills and comparison links further down to weigh Overture against similar tools.

Agentic AI for Beginners

Build your first AI agent from scratch - tool use, ReAct pattern, memory, deployment

41 minBeginner

Comments (0)

to leave a comment.

No comments yet. Be the first to share your thoughts!

Related Skills

superpowers

by obra

An agentic skills framework & software development methodology that works.

234,966

20,863

Shell

AI Agentsaibrainstorming

View details

Compare

ECC

by affaan-m

The agent harness performance optimization system. Skills, instincts, memory, security, and research-first development for Claude Code, Codex, Opencode, Cursor and beyond.

228,318

35,019

JavaScript

AI Agentsai-agentsanthropic

The agent that grows with you

212,870

39,316

Python

AI Agentsaiai-agent

View details

Compare

n8n

by n8n-io

Fair-code workflow automation platform with native AI capabilities. Combine visual building with custom code, self-host or cloud, 400+ integrations.

196,003

59,243

TypeScript

MCP Serversaiapis

View details

Compare

everything-claude-code

by affaan-m

The agent harness performance optimization system. Skills, instincts, memory, security, and research-first development for Claude Code, Codex, Opencode, Cursor and beyond.

185,940

28,768

JavaScript

AI Agentsai-agentsanthropic

View details

Compare

claude-code

by anthropics

Claude Code is an agentic coding tool that lives in your terminal, understands your codebase, and helps you code faster by executing routine tasks, explaining complex code, and handling git workflows - all through natural language commands.

120,031

19,897

Shell

AI Agents

View details

Compare

Browse all AI Agents skills

open-science UnrealGenAISupport

https://github.com/user-attachments/assets/eeb9c4cb-c80d-42da-bf63-c0c4ecb1e5d6

🔥 The Problem

Every AI coding agent today — Cursor, Claude Code, Cline, Copilot — works the same way:

What Happens Now

You type a prompt
Agent immediately starts writing code
You have zero visibility into what it's doing
You realize it misunderstood your request
Hundreds of lines of code need to be discarded
You've wasted tokens, time, and patience

Text Plans Don't Help

Some agents show plans as text in chat. But text fails to show:

Dependencies — which tasks depend on what?
Branch points — what alternative approaches exist?
Context requirements — which files, APIs, or secrets are needed?
Complexity — which steps are risky?
Progress — what's done, what's next?

✨ The Solution

Overture intercepts your AI agent's planning phase and renders it as an interactive visual flowchart — before any code is written.

The agent doesn't write a single line of code until you approve the plan.

🚀 Installation

Overture is an MCP server that works with any MCP-compatible AI coding agent. One command to install.

Claude Code

claude mcp add overture-mcp -- npx overture-mcp

Cursor

Add to ~/.cursor/mcp.json:

{
  "mcpServers": {
    "overture": {
      "command": "npx",
      "args": ["overture-mcp"]
    }
  }
}

Cline (VS Code Extension)

Open VS Code settings → search "Cline MCP" → add:

{
  "mcpServers": {
    "overture": {
      "command": "npx",
      "args": ["overture-mcp"]
    }
  }
}

GitHub Copilot

Create .vscode/mcp.json in your project root:

{
  "servers": {
    "overture": {
      "command": "npx",
      "args": ["overture-mcp"]
    }
  }
}

Note: GitHub Copilot MCP requires VS Code 1.99+ and uses servers instead of mcpServers.

Sixth AI (VS Code Extension)

Add to your Sixth AI MCP settings file:

Platform	Path
macOS	`~/Library/Application Support/Code/User/globalStorage/sixth.sixth-ai/settings/sixth-mcp-settings.json`
Windows	`%APPDATA%\Code\User\globalStorage\sixth.sixth-ai\settings\sixth-mcp-settings.json`
Linux	`~/.config/Code/User/globalStorage/sixth.sixth-ai/settings/sixth-mcp-settings.json`

{
  "mcpServers": {
    "overture": {
      "command": "npx",
      "args": ["overture-mcp"],
      "disabled": false
    }
  }
}

Global Installation (Optional)

npm install -g overture-mcp

Verify It Works

Give your agent any task. Overture automatically opens at http://localhost:3031 with your plan ready for approval.

🎯 How It Works

The Flow:

Step	What Happens
1. Prompt	You give your agent a task: "Build a REST API with auth"
2. Plan	Agent generates a detailed plan with steps, branches, and requirements
3. Visualize	Overture renders the plan as an interactive graph
4. Enrich	You click nodes, attach files, select branches, fill in API keys
5. Approve	You click "Approve & Execute" (or press Enter)
6. Execute	Watch real-time as nodes pulse, complete, or fail
7. Control	Pause (Spacebar), resume, re-run nodes, or modify the plan mid-flight

🛠 Features

Interactive Plan Canvas

Feature	Description
React Flow Canvas	Full pan, zoom, drag with smooth animations
Streaming Parser	Plan nodes appear in real-time as the agent generates them
Dagre Auto-Layout	Intelligent automatic positioning of nodes
Visual Status	Pending (gray) → Active (pulsing yellow) → Completed (green) / Failed (red)
Next Node Indicator	Blue pulse shows which node executes next
Complexity Badges	Low (green), Medium (yellow), High (red) at a glance
Glow Effects	Shadow glows highlight active and upcoming nodes
Insertable Edges	Hover over edges to insert new nodes mid-plan

Node Details Panel

Click any node to reveal its full details:

Info	What You See
Title & Description	Full context for what this step does
Complexity Level	Low / Medium / High with visual indicator
Expected Output	What the step should produce
Risks & Edge Cases	Potential issues to watch for
Pros & Cons	For branch options, compare trade-offs

Dynamic Fields (User Inputs)

Nodes can request input from you before execution:

Field Type	Use Case
String	Project names, URLs, custom values
Number	Port numbers, limits, counts
Boolean	Yes/No toggles for options
Select	Dropdown with predefined choices
Secret	API keys, tokens (masked input)
File	File paths to attach context

Each field includes:

Required/optional indicator
Default values
Help text & descriptions
Setup instructions ("How to get an API key")

File Attachments

Attach context files to specific nodes:

Automatic type detection — Image, code, document, or other
Visual icons per file type
Descriptions — add notes about why this file matters
Delete — remove unwanted attachments

Meta Instructions

Add custom LLM instructions to any node:

"Pay special attention to error handling here" "Use the existing auth pattern from src/auth.ts" "Make sure to add tests for edge cases"

Instructions are sent to the agent right before that node executes.