Install all 3 MCPs at once

Paste into .cursor/mcp.json or your client's MCP settings. Add API keys from each server's README where required.

{
  "mcpServers": {
    "figma": {
      "command": "npx",
      "args": [
        "-y",
        "@modelcontextprotocol/server-figma"
      ]
    },
    "playwright": {
      "command": "npx",
      "args": [
        "-y",
        "@playwright/mcp@latest"
      ]
    },
    "github": {
      "command": "npx",
      "args": [
        "-y",
        "@github/github-mcp-server"
      ],
      "env": {
        "GITHUB_PERSONAL_ACCESS_TOKEN": "YOUR_GITHUB_API_KEY"
      }
    }
  }
}

Setup steps

  1. Install each MCP using the combined config below
  2. Fill in required env vars for authenticated servers
  3. Restart your MCP client (Cursor / Claude / VS Code)
  4. Ask the agent to confirm tools are available

Once set up, try

  • Confirm all MCPs in Design QA are connected and list available tools
  • Walk me through a first workflow using Design QA
  • What env vars do I still need for Design QA?

Share this stack

Share on X
Set up with your agent

Paste into Cursor, Claude, or any agent that can run multi-step MCP setup.

Install the Averlo stack "Design QA" (Figma MCP, Playwright MCP, GitHub MCP) for Cursor.
1. For each server, read its README if install fails.
2. Merge this combined config:
{
  "mcpServers": {
    "figma": {
      "command": "npx",
      "args": [
        "-y",
        "@modelcontextprotocol/server-figma"
      ]
    },
    "playwright": {
      "command": "npx",
      "args": [
        "@playwright/mcp@latest"
      ]
    },
    "github": {
      "url": "https://api.githubcopilot.com/mcp/",
      "headers": {
        "Authorization": "Bearer YOUR_GITHUB_PAT"
      }
    }
  }
}
3. Collect any required API keys from the user; do not invent secrets.
4. Smoke-test each server.
Stack page: https://averlo.xyz/stacks/design-qa.html