Skip to main content

Installation

Pixello is available as an extension for both Cursor and VS Code. Installation is straightforward and takes just a few minutes.

Pixello works best in Cursor because it's optimized for AI-powered workflows.

Steps​

  1. Open Cursor
  2. Go to Extensions (⌘+Shift+X on Mac, Ctrl+Shift+X on Windows/Linux)
  3. Search for Pixello
  4. Click Install

👉 Install from Open VSX

Why Cursor?​

Cursor's AI-first architecture makes Pixello's design generation and editing flows more seamless. The extension integrates deeply with Cursor's AI features for a better experience.

Install on VS Code​

Pixello is also available on the VS Code Marketplace.

Steps​

  1. Open VS Code
  2. Go to Extensions (⌘+Shift+X on Mac, Ctrl+Shift+X on Windows/Linux)
  3. Search for Pixello
  4. Click Install

👉 Install from VS Code Marketplace

VS Code Support​

VS Code is fully supported, but AI flows are optimized for Cursor. You'll get all core features, but some advanced AI interactions work best in Cursor.

Configure MCP Server​

Pixello requires the MCP (Model Context Protocol) server to be configured in Cursor for AI-powered design generation to work.

Steps​

  1. Locate your MCP configuration file:

    • On macOS/Linux: ~/.cursor/mcp.json
    • On Windows: %APPDATA%\Cursor\mcp.json

  2. Open the file in a text editor (create it if it doesn't exist)

  3. Add the Pixello MCP server configuration:

    {
      "mcpServers": {
        "pixello": {
          "url": "https://mcp.pixello.tech/sse"
        }
      }
    }

  4. Save the file

  5. Restart Cursor for the changes to take effect

Verify MCP Server​

After restarting Cursor:

  1. Open the Command Palette (⌘+Shift+P / Ctrl+Shift+P)
  2. Type "Pixello"
  3. You should see Pixello commands available
  4. Try creating a design—if the MCP server is working, you'll see AI generation happening

Troubleshooting​

MCP server not connecting:

  • Check your internet connection
  • Verify the URL is correct: https://mcp.pixello.tech/sse
  • Ensure Cursor has been restarted after configuration
  • Check Cursor's output logs for MCP connection errors

Note: The MCP server is required for AI-powered design generation. Without it, you can still edit existing designs, but you won't be able to generate new designs from prompts.

After Installation​

Once installed and configured, you'll see the Pixello extension in your Extensions panel. The extension is active immediately.

Verify Installation​

  1. Open the Command Palette (⌘+Shift+P / Ctrl+Shift+P)
  2. Type "Pixello"
  3. You should see Pixello commands available

Next Steps​

Now that Pixello is installed and the MCP server is configured, learn how to create your first design.