OpenGraph MCP Server for Cline

What is Cline?

Cline is an autonomous AI coding agent that runs as a VS Code extension. It can create and edit files, run terminal commands, and now—with MCP—access web data to help with your development tasks.

Installation

1. Get Your App ID

   Sign up at dashboard.opengraph.io and copy your App ID.

2. Open Cline MCP Settings

   In VS Code, open the Cline extension settings. Look for the MCP Servers configuration section.

3. Add the Configuration

   Add the OpenGraph MCP server configuration:

   Cline MCP Settings

   Copy

   {
     "mcpServers": {
       "opengraph": {
         "command": "npx",
         "args": ["-y", "opengraph-io-mcp"],
         "env": {
           "OPENGRAPH_APP_ID": "YOUR_OPENGRAPH_APP_ID"
         }
       }
     }
   }

4. Restart Cline

   Reload the VS Code window or restart the Cline extension to load the new MCP server.

Use Cases with Cline

Cline's autonomous nature makes it particularly powerful with web data access:

Research Before Implementing

Research the Stripe API at https://stripe.com/docs/api and then implement a payment form component for React.

Competitive Analysis

Take a screenshot of https://linear.app, analyze their sidebar design, and create a similar component using Tailwind CSS.

Documentation Lookup

Scrape the Next.js documentation for getStaticProps and show me the correct usage pattern for my pages.

Content Migration

Scrape the blog posts from https://example.com/blog and convert them to MDX files for my new site.

Available Tools

With OpenGraph MCP, Cline can:

• Get OG Data – Extract metadata for link previews and research
• Screenshot – Capture pages for visual analysis and recreation
• Scrape – Fetch HTML for content extraction and analysis
• Query – Ask questions about page content

Troubleshooting

MCP tools not available?

• Reload the VS Code window after adding the configuration
• Check that Node.js is installed and in your PATH
• Verify your JSON configuration is valid
• Look for errors in the Cline extension output panel

Cline not using the tools?

Sometimes you need to explicitly mention the tool capability. Try asking:

Use the OpenGraph MCP tools to unfurl https://example.com and show me the metadata.

Related Guides