Codex CLI + MCP: How to Connect OpenAI's Agent to External Tools

Published: April 30, 2026

Category: Guides

MCP (Model Context Protocol) servers extend Codex CLI with external tool access. Instead of the agent working with just your local files, MCP servers connect it to databases, APIs, design tools, and services.

> Quick Answer: Codex CLI uses MCP (Model Context Protocol) servers to connect OpenAI's agent to external tools like databases (Supabase), version control (GitHub), design platforms (Figma), and more, allowing it to interact with and manage various services beyond local files.

What MCP Servers Add to Codex CLI

| MCP Server | What It Adds |
|---|---|
| GitHub | Read PRs, create issues, manage branches |
| Supabase | Query databases, read schemas, run migrations |
| Figma | Read design files, extract components |
| Playwright | Run browser tests, take screenshots |
| Slack | Read messages, post updates |
| Context7 | Access up-to-date library documentation |

Configuring MCP Servers

Codex CLI reads MCP configuration from your project or home directory config file.

Global Configuration

Create or edit ~/.codex/config.json:

{
  "mcpServers": {
    "github": {
      "command": "npx",
      "args": ["@github/mcp-server"],
      "env": {
        "GITHUB_TOKEN": "ghp_your_token"
      }
    },
    "supabase": {
      "command": "npx",
      "args": ["@supabase/mcp-server"],
      "env": {
        "SUPABASE_URL": "https://your-project.supabase.co",
        "SUPABASE_SERVICE_KEY": "your-key"
      }
    }
  }
}

Project-Specific Configuration

Add a .codex/config.json to your project root. Project config overrides global config.

Popular MCP Server Combinations

Frontend Development Stack

{
  "mcpServers": {
    "figma": { "command": "npx", "args": ["@anthropic/mcp-figma"] },
    "context7": { "command": "npx", "args": ["@context7/mcp-server"] },
    "playwright": { "command": "npx", "args": ["@anthropic/mcp-playwright"] }
  }
}

Figma for design-to-code, Context7 for framework docs, Playwright for testing. Pair with a frontend skill from Agensi for the best output.

Backend Development Stack

{
  "mcpServers": {
    "supabase": { "command": "npx", "args": ["@supabase/mcp-server"] },
    "github": { "command": "npx", "args": ["@github/mcp-server"] }
  }
}

Combining MCP Servers with Skills

MCP servers provide capabilities. Skills provide conventions. A frontend design skill tells the agent how to write code. The Figma MCP server gives it access to your designs. Together, the agent produces design-accurate code that follows your team's patterns.

Browse skills that complement MCP servers on Agensi.

Troubleshooting

Server not connecting: Check that the npm package is installed and the command path is correct. Try running the command manually.

Authentication errors: Verify your API tokens have the required permissions.

Slow responses: MCP servers add network latency. Limit MCP servers to the ones you actively use.

Related Articles