Reftrixmcp

MCP server · by TKMD

Search npm v0.1.8

Web design analysis with 26 MCP tools: layout, motion, quality, semantic search via pgvector

View source ↗ Generate config for multiple servers More servers

Install

Pin version registry version 0.1.8

npm
npx -y @reftrixmcp/mcp-server

npm
npx -y @reftrixmcp/mcp-server@0.1.8

Setup by client

Pick your client — the config below is generated for this server (local stdio). Copy respects the “Pin version” switch above.

claude_desktop_config.json

{
  "mcpServers": {
    "reftrixmcp": {
      "command": "npx",
      "args": [
        "-y",
        "@reftrixmcp/mcp-server"
      ],
      "env": {
        "DATABASE_URL": "<YOUR_DATABASE_URL>"
      }
    }
  }
}

{
  "mcpServers": {
    "reftrixmcp": {
      "command": "npx",
      "args": [
        "-y",
        "@reftrixmcp/mcp-server@0.1.8"
      ],
      "env": {
        "DATABASE_URL": "<YOUR_DATABASE_URL>"
      }
    }
  }
}

Format verified against the official Claude Desktop docs ↗.

terminal

claude mcp add --env DATABASE_URL=<YOUR_DATABASE_URL> reftrixmcp -- npx -y @reftrixmcp/mcp-server

claude mcp add --env DATABASE_URL=<YOUR_DATABASE_URL> reftrixmcp -- npx -y @reftrixmcp/mcp-server@0.1.8

Format verified against the official Claude Code docs ↗.

.cursor/mcp.json

{
  "mcpServers": {
    "reftrixmcp": {
      "command": "npx",
      "args": [
        "-y",
        "@reftrixmcp/mcp-server"
      ],
      "env": {
        "DATABASE_URL": "<YOUR_DATABASE_URL>"
      }
    }
  }
}

{
  "mcpServers": {
    "reftrixmcp": {
      "command": "npx",
      "args": [
        "-y",
        "@reftrixmcp/mcp-server@0.1.8"
      ],
      "env": {
        "DATABASE_URL": "<YOUR_DATABASE_URL>"
      }
    }
  }
}

Format verified against the official Cursor docs ↗.

.vscode/mcp.json

{
  "servers": {
    "reftrixmcp": {
      "command": "npx",
      "args": [
        "-y",
        "@reftrixmcp/mcp-server"
      ],
      "env": {
        "DATABASE_URL": "<YOUR_DATABASE_URL>"
      }
    }
  }
}

{
  "servers": {
    "reftrixmcp": {
      "command": "npx",
      "args": [
        "-y",
        "@reftrixmcp/mcp-server@0.1.8"
      ],
      "env": {
        "DATABASE_URL": "<YOUR_DATABASE_URL>"
      }
    }
  }
}

Format verified against the official VS Code docs ↗.

mcp_config.json

{
  "mcpServers": {
    "reftrixmcp": {
      "command": "npx",
      "args": [
        "-y",
        "@reftrixmcp/mcp-server"
      ],
      "env": {
        "DATABASE_URL": "<YOUR_DATABASE_URL>"
      }
    }
  }
}

{
  "mcpServers": {
    "reftrixmcp": {
      "command": "npx",
      "args": [
        "-y",
        "@reftrixmcp/mcp-server@0.1.8"
      ],
      "env": {
        "DATABASE_URL": "<YOUR_DATABASE_URL>"
      }
    }
  }
}

Format verified against the official Windsurf docs ↗.

Environment variables

Defined in the server's official registry manifest. Required secrets are shown as <YOUR_…> placeholders in the configs above.

DATABASE_URL required secret — PostgreSQL connection string with pgvector extension
REDIS_URL — Redis/Valkey connection URL for BullMQ job queue
OLLAMA_BASE_URL — Ollama API base URL for Vision LLM integration (default: http://localhost:11434)

GitHub

⭐ 2 stars · 最近更新于 67 天前 · AGPL-3.0 license

About this server

ReftrixMCP Web design knowledge base platform layout analysis, motion detection, and quality evaluation via MCP tools. For frontend engineers, designers, and AI agent builders who want to analyze real websites and retrieve reusable UI patterns via Claude or any MCP client.…

Summary from the project README — github.com/TKMD/ReftrixMCP

Distributed as npm, listed under Search. Review our MCP security guide before granting access to real data.

Frequently asked questions

What does the Reftrixmcp MCP server do?

How do I install Reftrixmcp?

Run the install command shown above, then paste the config for your client (Claude Desktop, Claude Code, Cursor, VS Code or Windsurf) into its MCP settings and restart the client.

Is Reftrixmcp free to use?

The MCP server itself is free to install. The source is public on https://github.com/TKMD/ReftrixMCP. Any third-party service it calls may require its own API key and account.

Which clients support Reftrixmcp?

Any MCP-compatible client can use it, including Claude Desktop, Claude Code, Cursor, VS Code, Windsurf and custom agents.

Add this badge

Publish this server? Link back with a badge on your README or site — copy either snippet.

Markdown

[![Listed on MCPNav](https://mcpnav.net/badge/reftrixmcp.svg)](https://mcpnav.net/server/reftrixmcp/)

HTML

<a href="https://mcpnav.net/server/reftrixmcp/"><img src="https://mcpnav.net/badge/reftrixmcp.svg" alt="Listed on MCPNav" height="20"></a>