Designers
Server Details
Checks, prompts and skills for designers working with AI: contrast, a11y, heuristics, critique.
- Status
- Healthy
- Last Tested
- Transport
- Streamable HTTP · MCP 2025-06-18
- URL
TDQS
Score is being calculated.
Available Tools
21 toolsaudit_page_accessibilityPage accessibilityARead-onlyInspect
Audit one page's static HTML for accessibility problems and name the WCAG 2.2 criterion for each: missing lang or title, images without alt, unlabelled form fields, vague or empty links and buttons, heading jumps, no main landmark, zoom-blocking viewport, autoplay with sound, tabindex above zero, duplicate ids, click handlers on non-interactive elements, tiny inline targets. It reads markup only and cannot test contrast, focus order or script-built widgets.
| Name | Required | Description | Default |
|---|---|---|---|
| url | No | Public page to fetch | |
| html | No | Or paste HTML instead | |
| compareUrl | No | A second URL (for example the redesign): returns what was fixed, what is new and what remains |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
The description goes far beyond the safety hints provided in the annotations. It details the operational constraints—that it reads markup only—and lists critical capabilities it lacks (contrast, focus order, script-built widgets), giving deep behavioral context.
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 definition is perfectly structured. It front-loads the comprehensive list of checks and immediately concludes with a highly dense, single sentence outlining critical limitations, maximizing informational density with zero waste.
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?
Given that no output schema is provided, the description is maximally complete by exhaustively detailing what the tool *does* check and, equally important, what it *cannot* check. This covers all necessary context for the agent to call it correctly.
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 coverage is 100%, so the schema adequately defines the parameters. The description does not add specific semantic meaning to the parameters (url, html, compareUrl) beyond what the well-defined schema already provides.
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 is highly specific, stating the verb ('Audit'), the resource ('page's static HTML'), and the exact scope (naming the WCAG 2.2 criterion for multiple specific failures). This clearly distinguishes it from a site-level audit.
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?
It provides excellent usage guidance by explicitly defining the tool's boundaries and limitations. The note 'It reads markup only and cannot test contrast, focus order or script-built widgets' tells the agent exactly when this tool is inappropriate and directs it toward alternatives like 'check_contrast'.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
audit_site_accessibilitySite accessibility crawlRead-onlyInspect
Pro. Crawl up to 15 same-origin pages from a start URL, audit each one's static HTML for WCAG 2.2 problems, and report issues by how many pages they affect so that shared-template problems come first. Returns a markdown report.
| Name | Required | Description | Default |
|---|---|---|---|
| url | Yes | Start page | |
| maxPages | No | 2 to 15, default 10 |
build_heuristic_reportHeuristic reportRead-onlyInspect
Pro. Build a scored, exportable markdown report from heuristic evaluation findings you have written. Each finding has heuristic (1 to 10), severity (0 to 4), location, issue, effect, fix and optional effort (S, M, L) and evaluator. Merges duplicates across evaluators, computes a health score, and sorts a fix-first table.
| Name | Required | Description | Default |
|---|---|---|---|
| task | No | The task that was evaluated | |
| title | No | Report title | |
| findings | Yes | Findings from the evaluation |
check_contrastContrastRead-onlyInspect
Check colour contrast. Give fg and bg, or pairs (a list of {fg, bg, label, sizePx, bold}), or a palette. Returns the WCAG 2.2 ratio with AA and AAA results for the text size, APCA Lc with what it is enough for, the nearest passing colour, and for palettes the colour pairs that become indistinguishable under protanopia, deuteranopia or tritanopia. Accepts hex, rgb(), hsl() and CSS names.
| Name | Required | Description | Default |
|---|---|---|---|
| bg | No | Background colour | |
| fg | No | Foreground colour | |
| bold | No | True if the text is bold, which changes the large-text threshold | |
| pairs | No | Several pairs at once | |
| sizePx | No | Text size in CSS px, default 16 | |
| palette | No | Colours to test against white, black and each other under colour blindness |
check_contrast_tokensToken contrast matrixARead-onlyInspect
Take a design token file (CSS custom properties like --color-text: #111;, a JSON object of colours, or W3C design tokens) and test every foreground-like token against every background-like token for 4.5:1 text and 3:1 component contrast, with the nearest passing colour, and find colours that merge under colour blindness. Free up to about 30 colours; Pro takes 200. Returns a markdown report.
| Name | Required | Description | Default |
|---|---|---|---|
| tokens | Yes | The token file contents |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
Beyond the standard safety hints in annotations, the description provides crucial operational constraints, detailing usage limits ('Free up to about 30 colours; Pro takes 200') and the exact output format ('Returns a markdown report'). These are valuable behavioral details.
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 highly dense and efficient, front-loading the core function and following immediately with the detailed process, metrics, and constraints. Every phrase contributes necessary information to the agent.
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?
Given the complexity of the task (multi-criterion comparison, specific outcomes like 'nearest passing colour' and 'colors that merge under colour blindness'), the description is highly complete. It covers the input format, the testing methodology, usage constraints, and the output type without relying on an output schema.
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?
With 100% schema coverage, the description's role is secondary, but it still adds significant semantic value by clarifying the *nature* of the required input—specifying that 'tokens' must be in formats like 'CSS custom properties' or 'W3C design tokens,' guiding the agent on the expected content type.
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 purpose is stated with extreme specificity, focusing on testing 'foreground-like token against every background-like token.' This immediately differentiates it from general contrast checks by targeting design tokens and defining the precise methodology (4.5:1 and 3:1 ratios).
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 functions as a strong guideline by explicitly defining the required input format: 'design token file (CSS custom properties... or W3C design tokens).' This tells the agent exactly when to use this specialized tool, contrasting it implicitly with general tools that might take rendered images.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
check_touch_targetsTouch targetsRead-onlyInspect
Check target sizes and spacing against WCAG 2.2 SC 2.5.8 (24 by 24 CSS px, or a smaller target with enough spacing), the 44px guidance for iOS and the web, and 48dp for Android. Pass targets as a list of {name, width, height, gap, inline} or text lines like 'Save button 40x32 gap=8'. Returns pass or fail per guideline with advice.
| Name | Required | Description | Default |
|---|---|---|---|
| text | No | Or lines like 'Close icon 32x32 gap=4' | |
| targets | No | Targets to check |
detect_design_slopAI design slopRead-onlyInspect
Look for the default AI-generated design look in a live page's markup and CSS: purple-to-blue gradients, gradient text, a default font stack, pill buttons with arrows, uppercase eyebrow labels, emoji headings, glassmorphism, glow blobs, equal card grids, stock marketing phrases and placeholder copy. Returns weighted signals and a 0 to 100 score. Signals, not proof.
| Name | Required | Description | Default |
|---|---|---|---|
| url | Yes | Public page to read | |
| compareUrl | No | A second URL: returns what became less or more generic |
doctorDoctorRead-onlyInspect
Diagnose setup problems. Reports what the server sees about this connection (client, whether a Pro key was received and is active, plan), checks a Figma link for the right shape (frame link with node-id, not a prototype or Community page), and matches a described symptom to fixes for: connected but nothing happens, local versus remote servers, 401 and 403, rate limits, tools or skills not triggering, and Figma selection problems. Does not use up a daily call.
| Name | Required | Description | Default |
|---|---|---|---|
| client | No | Claude Desktop, claude.ai, Claude Code, Cursor, VS Code, Codex or ChatGPT | |
| symptom | No | What is going wrong, in the person's words | |
| figmaLink | No | A Figma link to check |
get_project_contextGet project contextRead-onlyInspect
Pro. List the saved project context, or read one item by name.
| Name | Required | Description | Default |
|---|---|---|---|
| name | No | Omit to list everything saved |
getting_startedGetting startedRead-onlyInspect
Explain what this server can do and suggest the three best first tasks for what the person has (a Figma link, a live URL, copy, a research plan, an event list). Use this first when the person is new or unsure what to ask for.
| Name | Required | Description | Default |
|---|---|---|---|
| have | No | What they have, in their own words, e.g. 'a Figma link and some button copy' |
heuristic_worksheetHeuristic reviewARead-onlyInspect
Build a Nielsen ten-heuristics review worksheet for a screen or flow. Give text (the copy of the flow), html or a url. Returns, for each heuristic, keyword and markup signals found or missing, review prompts, and blanks for findings and 0 to 4 severity. The signals point at where to look; a human evaluation is still required.
| Name | Required | Description | Default |
|---|---|---|---|
| url | No | Public page to read instead of pasted text | |
| html | No | Page HTML, if you have it instead of a URL | |
| task | No | The task the reviewer is evaluating, e.g. 'change a billing address' | |
| text | No | Screen or flow copy |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
Beyond the safety hints provided by annotations, the description discloses critical operational behavior. Specifically, it defines what the tool returns (signals, prompts, severity) and, crucially, includes the behavioral constraint: 'a human evaluation is still required.'
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 definition is exceptionally dense and efficient. It front-loads the purpose and then details the mechanics (inputs, outputs, warnings) without any filler or unnecessary preamble.
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?
Since no output schema is provided, the description fully compensates by detailing the comprehensive output structure, including 'keyword and markup signals found or missing, review prompts, and blanks for findings and 0 to 4 severity.' This makes the definition functionally complete.
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?
Although the input schema is 100% covered, the description adds important domain context. It specifies the required format options (text, HTML, URL) and gives a concrete example of the content expected for the 'task' parameter, making the inputs more meaningful to the agent.
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 is highly specific, stating the goal is to 'Build a Nielsen ten-heuristics review worksheet.' It clearly defines the output structure (signals, prompts, severity) and the resource it operates on (screen or flow).
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?
It clearly guides the user on acceptable input modalities ('text', 'html', or 'url') and gives a concrete example for the 'task' parameter. While it doesn't explicitly compare itself to every sibling, its focus on Nielsen heuristics provides strong differentiation.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
lint_design_feedbackFeedback lintRead-onlyInspect
Lint design critique. Sorts each note into observation, opinion, solution-without-problem, vague, or question, explains what is missing, and gives an observation, impact, suggestion skeleton for weak notes. Reports the share of notes ready to act on.
| Name | Required | Description | Default |
|---|---|---|---|
| text | Yes | One note per line, or paragraphs |
lint_design_mdDESIGN.md checkRead-onlyInspect
Score a DESIGN.md (the brand and design context file models read before building): missing sections, no hex values, text and background pairs that fail contrast, too many typefaces, adjectives a model reads as the generic look, no never-list, no sizes, too long or too thin.
| Name | Required | Description | Default |
|---|---|---|---|
| text | Yes | The DESIGN.md contents |
lint_research_questionsResearch questionsRead-onlyInspect
Lint user research questions, one per line, for leading wording, double-barrelled questions, hypotheticals, predictions, loaded words, jargon, closed questions in an open interview, why-questions and unlabelled rating scales, with a suggested rewrite for each problem.
| Name | Required | Description | Default |
|---|---|---|---|
| mode | No | Default interview | |
| text | Yes | One question per line |
lint_token_namesToken namesRead-onlyInspect
Lint design token names from a list, CSS variables or a JSON token file: mixed separators, colours named by hue where roles belong, values or locations in names, version words, duplicate values, abbreviation drift (bg and background) and irregular scales.
| Name | Required | Description | Default |
|---|---|---|---|
| text | Yes | Token names or file contents |
lint_tracking_planTracking planRead-onlyInspect
Lint a product analytics tracking plan (event names with optional properties, one per line like 'project_created (template, source)') for mixed naming styles, vague events, UI-element names, near-duplicate events, tense and order drift, and personal data in property names. With no events and a productType (saas, ecommerce, marketplace, content, mobile) it drafts a starter plan.
| Name | Required | Description | Default |
|---|---|---|---|
| text | No | Events, one per line, or a JSON array | |
| events | No | Or a list of strings or {name, properties} | |
| productType | No | Draft a starter plan for this kind of product |
plan_critiqueCritique planRead-onlyInspect
Plan a design critique for a stage (concept, wireframe, visual, prototype, build, shipped): a framing statement, timed agenda, the questions that fit the stage, roles, and the kinds of feedback to turn away until a later stage.
| Name | Required | Description | Default |
|---|---|---|---|
| goal | No | What the design has to achieve | |
| stage | Yes | Where the work is now | |
| minutes | No | Session length, 15 to 120, default 30 | |
| audience | No | Who it is for | |
| description | Yes | A sentence or two about the design |
review_ui_copyUI copyRead-onlyInspect
Review interface copy, one string per line, optionally prefixed with a type (button:, error:, empty:, tooltip:, placeholder:, heading:, toast:, label:). Checks each string for what its type needs (errors say what to do, empty states give a next step, buttons name the outcome), checks the set for inconsistency, and runs AI-writing tells over everything.
| Name | Required | Description | Default |
|---|---|---|---|
| text | No | One string per line, e.g. 'button: Submit' or 'error: Invalid input' | |
| items | No | Or a list of strings or {text, type} |
save_project_contextSave project contextRead-onlyInspect
Pro. Save named project context (brand notes, a DESIGN.md, past decisions, personas) against the Pro key, up to 20 items of 50,000 characters, so later sessions and prompts can reuse it.
| Name | Required | Description | Default |
|---|---|---|---|
| name | Yes | e.g. design-md, brand-voice | |
| content | Yes | The text to save |
usability_statsUsability numbersRead-onlyInspect
Usability arithmetic with formulas shown. mode sus: score System Usability Scale responses (rows of ten 1-5 answers) with grade, percentile and 95% interval. mode discovery: participants needed to find a share of problems (Nielsen and Landauer). mode ab: sample size per variant for a conversion test (baseline, lift in percent, optional dailyVisitors). mode survey: responses needed for a margin of error.
| Name | Required | Description | Default |
|---|---|---|---|
| p | No | discovery: chance a participant hits a problem, default 0.31 | |
| lift | No | ab: smallest relative lift to detect, percent | |
| mode | No | Which calculator | |
| alpha | No | ab: significance level, 0.1, 0.05 or 0.01 | |
| power | No | ab: 0.8, 0.9 or 0.95 | |
| margin | No | survey: margin of error, e.g. 0.05 | |
| target | No | discovery: share of problems to find, default 0.85 | |
| baseline | No | ab: current conversion rate, e.g. 0.05 | |
| responses | No | sus: array of 10-number arrays | |
| confidence | No | survey: 0.9, 0.95 or 0.99 | |
| population | No | survey: total population, for the finite-population correction | |
| dailyVisitors | No | ab: traffic per day, to estimate how long to run |
Tool Schema Changelog
Recent tool additions, removals, and schema changes observed during successful MCP inspections.
21 tool updates
- First observed
audit_page_accessibility - First observed
audit_site_accessibility - First observed
build_heuristic_report - First observed
check_contrast - First observed
check_contrast_tokens - First observed
check_touch_targets - First observed
detect_design_slop - First observed
doctor - First observed
get_project_context - First observed
getting_started - First observed
heuristic_worksheet - First observed
lint_design_feedback - First observed
lint_design_md - First observed
lint_research_questions - First observed
lint_token_names - First observed
lint_tracking_plan - First observed
plan_critique - First observed
review_ui_copy - First observed
save_project_context - First observed
usability_stats - First observed
whoami
Related MCP Connectors
Design quality gate for AI-generated UI: score any URL on 45 deterministic checks, A–F grade.
Run accessibility, contrast, and design token audits and file QA issues from your AI coding tool.
311AI-agent design tools: fonts, font recognition, palettes, color naming, contrast, code, SVG, CSS.
A design harness for AI coding agents: design systems, design principles, icons and UI review.
Related MCP Servers
- AlicenseAqualityCmaintenanceWCAG contrast checks, color palettes & 500+ free UI tools for your AI agent3MIT
- AlicenseAqualityDmaintenanceEnables AI assistants to analyze design images for composition, color harmony, typography, and accessibility compliance with actionable recommendations.66MIT
- AlicenseAqualityCmaintenanceEnables AI assistants to work with color: converting between formats like HEX, OKLCH and Display P3, checking and fixing WCAG 2 and APCA contrast, auditing palettes for accessibility and color blindness, and generating palettes, gradients, scales and design tokens.18MIT
- AlicenseNot gradedqualityAmaintenanceEnables AI coding assistants to generate bespoke design systems by synthesizing OKLCH color palettes, chamfer highlights and spring physics, teaching layout composition grammar, and returning micro-interaction primitives and component blueprints. Also audits JSX/TSX/HTML through a senior design director's lens to score and critique UI quality.21 npm1MIT
Glama MCP Gateway
Add one secure layer between your agents and this server.