Frontend Review MCP
Click on "Deploy Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type
@followed by the MCP server name and your instructions, e.g., "@Frontend Review MCPreview the new button placement against the mockup"
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
CS-Wallet 
Wallet for CoinSpace app.
Available Tools
1 toolreviewEditB
Perform a visual review of a UI edit request. The 'before screenshot' is a screenshot of the page before the edit, and the 'after screenshot' is the screenshot of the page after the edit. You will recieve either a yes or no response, indicating whether the edit visually satisfies the edit request. If no, it will provide a detailed explanation of why the edit does not satisfy the request so you can continue to work on it.
| Name | Required | Description | Default |
|---|---|---|---|
| beforeScreenshotPath | Yes | Absolute path to the 'before' screenshot file (png) | |
| afterScreenshotPath | Yes | Absolute path to the 'after' screenshot file (png) | |
| editRequest | Yes | A detailed description of the UI edit request made by the user. Do not describe the changes you made, but just summarize what the user asked you to change on the page. |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations provided, the description carries full behavioral disclosure burden. It describes the core behavior (visual review returning yes/no with explanations) and the iterative nature ('continue to work on it'). However, it doesn't disclose important behavioral traits like processing time, file size limitations, authentication needs, error conditions, or what constitutes a valid screenshot.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is appropriately sized (3 sentences) and front-loaded with the core purpose. Each sentence adds value: first states purpose, second explains parameters, third describes outcomes. There's minimal redundancy, though the second sentence could be slightly more concise.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
For a 3-parameter tool with no annotations and no output schema, the description provides adequate but incomplete context. It covers the basic workflow and outcome format but lacks details about error handling, performance characteristics, or what specific visual criteria are used for evaluation. The absence of output schema means the description should ideally explain return values more thoroughly.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
Schema description coverage is 100%, providing complete parameter documentation. The description adds minimal value beyond the schema: it clarifies that screenshots represent 'before' and 'after' states and mentions the edit request context. However, it doesn't provide additional semantic context about parameter relationships or usage nuances beyond what's already in the schema descriptions.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the tool's purpose: 'Perform a visual review of a UI edit request' with specific resources (before/after screenshots) and verb (review). It explains what the tool does (evaluates if edit satisfies request) and the outcome (yes/no with explanation). However, without sibling tools, it cannot demonstrate differentiation from alternatives.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description implies usage context: when you have UI edit screenshots and need validation. It mentions 'so you can continue to work on it' suggesting iterative improvement workflow. However, there's no explicit guidance on when to use this tool versus other validation methods or prerequisites for effective use.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
Tool Schema Changelog
Recent tool additions, removals, and schema changes observed during successful MCP inspections.
1 tool update
- First observed
reviewEdit
TDQS
Scored across 1 tool
With only one tool, there is no possibility of ambiguity or overlap with other tools. The tool 'reviewEdit' has a single, clearly defined purpose focused on visual review of UI edits.
Since there is only one tool, naming consistency is inherently perfect. The tool name 'reviewEdit' follows a clear verb_noun pattern, and there are no other tools to compare it against for inconsistency.
A single tool is generally too few for a server's purpose, as it limits functionality and can feel thin. For a 'Frontend Review MCP', one might expect additional tools for tasks like listing reviews, managing requests, or handling different types of edits, making this count inappropriate for the apparent scope.
The tool set is severely incomplete for a frontend review domain. While 'reviewEdit' handles the core review action, there are obvious gaps such as tools for creating, listing, updating, or deleting review requests, which would be essential for a complete workflow and could cause agent failures due to missing operations.
Maintenance
Related MCP Connectors
MCP server for visual regression testing: triage a PR's UI diffs from your coding agent.
An MCP server that automatically collects feedback on your MCP server.
UX-review and product-feedback MCP: annotated screenshots and reviews your AI agent can act on.
MCP server for Midjourney AI image generation and editing
Related MCP Servers
- FlicenseBqualityNot gradedmaintenanceAn MCP server that visually reviews UI edit requests by comparing screenshots before and after edits, ensuring changes satisfy user requests.110 npm31-
- FlicenseNot gradedqualityDmaintenanceAn MCP server that provides agentic vision capabilities for visual regression testing by capturing and comparing screenshots using Gemini Flash. It enables users to detect UI changes and conduct conversational investigations to distinguish between intended and unintended visual modifications.-
- FlicenseAqualityNot gradedmaintenanceAn MCP server that enables users to review and refine AI outputs through a local web UI, returning feedback as free tool call results to save on GitHub Copilot premium requests. It allows for multiple rounds of iterative improvements within a single request session.130-
- AlicenseAqualityDmaintenanceAn MCP server that enables automated quality control for generated images, evaluating them against reference images and rules to return structured scores and issues.2MIT