Framer Plugin MCP

🚀 Framer Plugin MCP Server

A Model Context Protocol (MCP) server that supports creating and managing Framer plugins with blockchain capabilities. This server provides tools for creating, building, and managing Framer plugins integrated with blockchain features such as wallet connections, smart contract interactions, and NFT displays.

🚀 Quick Start

The Framer Plugin MCP Server is a powerful tool for creating and managing Framer plugins with blockchain capabilities. Follow the steps below to get started.

✨ Features

• Create new Framer plugins integrated with blockchain capabilities.
• Build plugins for production environments.
• Integrated blockchain features:
  • Wallet Connect integration.
  • Smart contract interaction.
  • NFT display components.

📦 Installation

System Requirements

• Node.js 16 or higher.
• NPM or Yarn.
• Framer desktop application for testing plugins.

Installation Steps

1. Clone this repository:

git clone https://github.com/sheshiyer/framer-plugin-mcp.git
cd framer-plugin-mcp

2. Install dependencies:

npm install

3. Build the server:

npm run build

📚 Documentation

Configuration

Add the server to your MCP settings file:

For the Claude desktop application (~/Library/Application Support/Claude/claude_desktop_config.json):

{
  "mcpServers": {
    "framer-plugin": {
      "command": "node",
      "args": ["/path/to/framer-plugin-mcp/build/index.js"]
    }
  }
}

For the Cursor/Claude development version (~/Library/Application Support/Cursor/User/globalStorage/saoudrizwan.claude-dev/settings/cline_mcp_settings.json):

{
  "mcpServers": {
    "framer-plugin": {
      "command": "node",
      "args": ["/path/to/framer-plugin-mcp/build/index.js"]
    }
  }
}

Usage

After configuration, the server provides the following tools:

💻 Usage Examples

Basic Usage

create_plugin

Create a new Framer plugin project with blockchain capabilities.

Parameters:

• name: Plugin name.
• description: Plugin description.
• outputPath: Output directory path.
• web3Features: List of features to include (wallet-connect, contract-interaction, nft-display).

Example:

{
  "name": "my-web3-plugin",
  "description": "A Framer plugin with blockchain capabilities",
  "outputPath": "./plugins/my-web3-plugin",
  "web3Features": ["wallet-connect", "nft-display"]
}

build_plugin

Build a Framer plugin project for a production environment.

Parameters:

• pluginPath: Plugin directory path.

Example:

{
  "pluginPath": "./plugins/my-web3-plugin"
}

🔧 Contribution

Contributions are welcome! Please feel free to submit a Pull Request.

📄 License

This project is licensed under the MIT License - see the LICENSE file for details.