refero-design-mcp
An MCP server that gives an assistant read-only access to real design systems published on styles.refero.design — covering coverage checks, search, brief matching, and extraction of palettes, type scales, spacing and guidance.
Check index coverage (
refero_index_status) — see how many styles are published vs. indexed locally before concluding a style doesn't exist.Search styles by free text (
refero_search_styles) — match names, north stars, colours, fonts and URLs; limit results and optionally expand the local index.Match a prose brief to styles (
refero_match_style) — rank styles for qualitative asks like "dark, dense dashboard", with matched terms and rationale.Render a style as
design.md(refero_get_design_md) — request only the sections you need (overview, colors, typography, type_scale, spacing, surfaces, imagery, principles, components, similar, custom).Get a style as structured JSON (
refero_get_style) — parsed design system plus optionally the raw measured tokens.List style UUIDs (
refero_list_style_ids) — read ids and last-modified timestamps from the public sitemap without fetching any page.Safe by default — every tool is read-only, idempotent, non-destructive, and open-world.
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., "@refero-design-mcpmatch a clean SaaS style with a blue palette, then render design.md"
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.
@darcas/refero-design-mcp
The underlying data belongs to Refero Design. This is an unofficial client; no affiliation or endorsement is implied.
An MCP server for discovering, searching and extracting design systems from the public pages of styles.refero.design.
Give an assistant a real design system — palette, type scale, spacing, surfaces, do/don't guidance — instead of one it invented.
The package also ships an Agent Skill,
refero-design-research, that teaches a coding agent to do evidence-based design research with this server before implementing UI — see The skill.
Why it is built this way
Two decisions shape everything else.
The JSON API is not used. styles.refero.design/robots.txt disallows
/api/, and the endpoint is gated in practice: it answers 403 to every
non-browser client and 200 to a real browser, which points at TLS fingerprinting
rather than authentication. Spoofing headers would not fix that, and would not be
the right thing to do regardless.
So this server reads only what Allow: / permits — the published sitemap and the
public style pages — reachable with a plain curl and no pretending to be
anything else. Requests are conditional, concurrency-capped, and sent with a
User-Agent that identifies the project.
Coverage is reported, never implied. A style page is a few hundred KB and
there are over a thousand of them, so the local index grows on demand. That
makes "I found no matches" ambiguous — it usually means "I looked at 30 of
1,340", not "nothing exists". Every search states its own coverage, and
refero_index_status exists so the model can check before concluding a style is
absent.
Related MCP server: CDS Components MCP Server
Performance
The index is deliberately lazy, so almost every tool call has to answer "how much do we actually have?" before it can answer anything else. Getting that wrong is the difference between a search that returns in under a millisecond and one that stalls for seconds.
The store keeps cached summaries and known-absent ids in memory, and reads the cache directory once per session instead of probing a path per style. Both directions matter: remembering only the hits would leave the larger half of the catalogue re-read on every call.
Operation | Before | After | Speed-up |
| 15.5 ms | 12.6 ms | 1.2× |
| 27.9 ms | 0.15 ms | 186× |
| 49.0 ms | 0.10 ms | 490× |
First call in a process | 372 ms | 70 ms | 5.3× |
speed-up, log scale
490x ████████████████████████████████████████ expand scan, all cached
186x ██████████████████████████████████ refero_index_status
5.3x ███████████ first call in a process
1.2x █ rank 1,342 summariesTwo honest notes on those numbers.
The ranking barely moved, and that is deliberate. It was measured before being optimised: at ~13 ms across the whole catalogue it was never the bottleneck, so the scorer was left alone rather than tuned against a guess.
The first call in a process is dominated by one sitemap request, not by the disk. That fetch is what makes coverage honest, and it is why it happens once rather than per call.
Median of 15 runs on an Intel i9-12900F / Linux / Node 22, against a warm local cache holding 26 of 1,342 published styles. "Before" is the previous implementation, measured in the same session on the same machine. Your numbers will differ; the ratio is the point, not the milliseconds.
Tools
Tool | Purpose |
| Published styles vs. locally indexed styles |
| Free-text search over names, north stars, colours, fonts, URLs |
| Ranks styles against a prose design brief |
| Renders a style as |
| Parsed design system plus measured tokens, as JSON |
| Style UUIDs from the sitemap, without reading any page |
Every tool declares all four MCP behavioural hints — readOnlyHint: true,
destructiveHint: false, idempotentHint: true, openWorldHint: true. None of
them mutates the origin, the cache, or anything the caller owns; all of them can
read styles.refero.design. Clients that gate on these get an accurate answer
without having to infer it.
A resource, refero://style/{id}/design.md, is exposed for clients that prefer
resource reads over tool calls.
Sections
refero_get_design_md takes sections, and honours it:
overview · colors · typography · type_scale · spacing · surfaces
imagery · principles · components · similar · customSections with no data are dropped rather than rendered as empty headings.
Installation
npm install -g @darcas/refero-design-mcpInstalls the refero-design-mcp and refero-design-skill commands — the
binary names stay unscoped, so client configs stay short.
Requires Node ≥ 22.12. Node 20 reached end-of-life on 2026-04-30, so 1.1.0
drops it; npm reports EBADENGINE on an older runtime. Everything else about
installing and running is unchanged.
The skill
The package also ships an Agent Skill — skill/refero-design-research/ —
that teaches a coding agent to do evidence-based design research with the Refero
Design MCP before implementing substantial UI. It is a separate deliverable from
the MCP itself and neither replaces the other: the MCP answers questions about
styles, the skill decides how to ask them.
When the MCP is not installed, the skill can set it up for you — after asking, and only for this package. The per-client instructions it follows are in install-mcp.md.
refero-design-skill installThat is the whole command. It detects the agent clients you have, writes one
shared copy under ~/.agents/skills/, and links each client to it.
refero-design-skill list # what is installed where
refero-design-skill install --client claude,codex # pick clients
refero-design-skill install --project # copy into the repository
refero-design-skill install --dry-run # print the plan, write nothing
refero-design-skill uninstall --client claude # remove what it installedFlag | Effect |
| Comma-separated ids from |
| Defaults to |
| Shorthands for |
| Every client whose detect directory already exists. Bare |
| Escape hatch for an unsupported client or an unusual location |
| Print the resolved plan and touch nothing |
| Required to overwrite local modifications, and it prints the diff first |
Declare the scope once. --global --project and --scope project --global
both fail: picking one silently would install to the other place while you
believe you chose. A boolean flag given a value (--force=1) fails for the same
reason.
Note the two scopes here decide where the skill files go. They are unrelated to the global/local question in Configuration, which decides where the MCP server entry goes in a client's config.
Global scope links rather than copies, so the skill is one file on disk with
several names pointing at it; project scope copies, so it can be committed.
Links are created as junction on Windows, and a skills directory that is
itself a symlink is written through rather than replaced.
There is no postinstall. Nothing is written outside node_modules by
installing the package — only an explicit refero-design-skill install
writes anything, so upgrade the package and re-run it.
The skill is not affiliated with Refero Design, and it contains no Refero data:
only instructions, plus a tool reference generated from src/.
See skill/refero-design-research/README.md for what the skill does and who it is for.
Configuration
Point a client at the package, run on demand through npx — no install step,
first run downloads the package:
{
"mcp": {
"servers": {
"refero-design-mcp": {
"command": ["npx", "-y", "@darcas/refero-design-mcp@1"]
}
}
}
}-y suppresses the install prompt, which would otherwise block startup. The
version is pinned to the current major so an unattended -y cannot pull a
breaking release. Starts in about 2s on a cold cache, under 1s once cached.
If the package is installed globally (npm install -g @darcas/refero-design-mcp), the entry can call the binary directly instead:
"refero-design-mcp": {
"command": ["refero-design-mcp"]
}This form works only with the global install in place — without it the
client fails to start the server (exit 127: refero-design-mcp: not found).
Either form behaves identically once running.
One trap, for developing this package rather than using it. Both forms fail
with exit 127: sh: 1: refero-design-mcp: not found when the client's working
directory is a checkout of this repository, and work everywhere else. Inside
its own checkout the package.json matches the package name, so npx resolves
the request to the local project instead of the registry — and a project never
links its own bins into node_modules/.bin, so npx ends up running the bare
binary name, which is not on the PATH. If you hit it, name the package and the
binary separately:
"refero-design-mcp": {
"command": ["npx", "-y", "-p", "@darcas/refero-design-mcp@1", "refero-design-mcp"]
}No other user hits this: it needs a local package.json with this exact name.
The package is scoped but the binary is not, so the command is
refero-design-mcp with no @darcas/ prefix.
The default transport is stdio; see Remote (Streamable HTTP)
to serve it over the network. Diagnostics go to stderr only — stdout carries JSON-RPC
frames and nothing else. A server started by hand (npm start) will appear to
hang: it is waiting for a client on stdin, which is correct behaviour.
Remote (Streamable HTTP)
A second binary, refero-design-mcp-http, serves the same tools over
Streamable HTTP
at POST /mcp, so a client that cannot spawn a process can reach it by URL.
npx -y -p @darcas/refero-design-mcp refero-design-mcp-http
# listening on http://127.0.0.1:3000/mcpOr with Docker, which keeps the cache in a named volume:
docker compose up -d --buildClient configuration:
{
"mcp": {
"servers": {
"refero": { "type": "remote", "url": "https://mcp.example.com/mcp" }
}
}
}Stateless. Each request is self-contained, so there is no session to lose on restart.
GETandDELETEon/mcpanswer405.No authentication. Anyone who can reach the port can use the server, and every call can make it fetch from
styles.refero.design. Keep it on a private network, or put a reverse proxy with HTTPS (and whatever access control you need) in front. The compose file publishes on loopback for that reason.GET /healthreturns{"status":"ok","version":"…"}for probes.HEADanswers the same headers with no body.Proxy timeouts. A call that expands the index can take a few seconds; do not set the proxy's read timeout below ~60 s, and disable response buffering (
proxy_buffering offin nginx) so streamed responses arrive as they are sent.
Two settings are specific to this binary and are read by src/cli-http.ts, not
src/config.ts: REFERO_HTTP_HOST (interface to bind, 127.0.0.1 by default,
0.0.0.0 in the image) and REFERO_HTTP_PORT (default 3000, falls back to
PORT). Every variable in the next section applies here too.
Environment variables
Every setting is optional.
Variable | Default | Purpose |
|
| On-disk cache location |
|
| Cache freshness window (7 days) |
|
| Max simultaneous requests |
|
| Max page fetches per tool call |
|
| Response budget |
|
| Origin base URL |
|
| Style index |
|
| Per-request timeout |
| see | Request identification |
|
| Diagnostics to stderr |
Alphabetical, so a variable is found by looking rather than by knowing which
group it sits in. The defaults are the ones src/config.ts validates at startup;
REFERO_MAX_FETCHES, REFERO_CONCURRENCY and REFERO_TIMEOUT_MS are the three
worth touching first when you want faster research rather than more of it.
Example session
// The model calls these in sequence
{
"name": "refero_index_status",
"arguments": {}
}
// → "Published styles: 1342 / Indexed locally: 1 / Coverage: <1% (1 styles)"
{
"name": "refero_match_style",
"arguments": {
"brief": "dark, dense dashboard for engineers"
}
}
// → ranked styles, each with matched terms and the north star that drove the match
{
"name": "refero_get_design_md",
"arguments": {
"style_id": "a73148b9-449b-42cd-9f38-86ef694f500e",
"sections": ["overview", "colors", "typography"]
}
}
// → # Apple, with the palette table and type scaleHow styles are indexed
sitemaps/styles.xml → list of ids + lastmod (small, fetched once)
↓
/style/{id} → Next.js RSC payload in HTML (~300 KB, fetched on demand)
↓
result.meta / result.raw / result.designSystem (parsed, validated, cached)The style record is located by styleId. A page embeds a dozen or more related
styles that share the same key names, so anchoring on the id is what prevents
returning a neighbour's palette.
The RSC format is internal to Next.js and may change. Every failure surfaces as a typed error rather than a partially-filled object that looks like a valid answer.
Development
npm install
npm run dev # watch mode
npm run verify # typecheck + lint + test + buildScript | Action |
| Compile to |
| Run the compiled server |
|
|
| ESLint, type-aware rules |
| Vitest |
| All of the above, in order |
| Remove |
| Test, build, then publish to npm |
Testing
125 tests across 9 files.
Unit tests run offline, against a hand-assembled sample of a real RSC payload — the fragile parts (id anchoring, brace matching, lazy reference detection) are exactly the parts worth pinning.
test/e2e.test.ts drives the server against the live site and skips itself when
the origin is unreachable. The reachability probe runs at module load rather
than in a hook, because describe.skipIf is evaluated during collection: a
probe in beforeAll leaves every test silently skipped, which is
indistinguishable from a passing suite.
Design notes
Schemas derived from real payloads, not from documentation.
spacing.radiusis a per-element map ({cards: "28px", buttons: "9999px"}), not a string.similaris[{business, why}]on current styles but bare strings on older ones.surfacesis{hex, name, level, purpose}. AtypeScalesize arrives as"17"on one style and17on the next, and is normalised to a string at the boundary. Every schema is permissive about type and strict about presence, so a partial document degrades instead of throwing away a whole design system.Measured and curated data are both kept.
result.rawholds tokens with usage frequency and context;result.designSystemholds the curated reading. Frequency is what separates a signature colour from an incidental one.Truncation respects structure. Cutting markdown with
slice(0, n)slices code fences in half, which makes the model read broken CSS as if it were the design. This server trims on a structural boundary instead, and closes any fence it opens, so a shortened document is still valid. Every path that caps a response goes through that helper, includingrefero_get_design_md.A malformed
style_idnever costs a request. Ids are checked against the UUID shape before anything reaches the network or the cache directory, so a wrong id returns an error naming the tool that lists valid ones instead of a bare404.Conditional requests everywhere, so a repeat call usually costs a 304.
License
This project is licensed under the MIT License. See the LICENSE file for details.
Available Tools
6 toolsrefero_get_design_mdGet design.md for a styleARead-onlyIdempotent
Render a style as a design.md document. The sections argument is honoured: request only the sections you need to stay within budget. Without it you get the whole document, truncated on a structural boundary.
| Name | Required | Description | Default |
|---|---|---|---|
| refresh | No | Bypass the local cache and refetch (conditional request). | |
| sections | No | Which sections to include, in any order: overview, colors, typography, type_scale, spacing, surfaces, imagery, principles, components, similar, custom. Omit for everything. | |
| style_id | Yes | Style UUID, e.g. "a73148b9-449b-42cd-9f38-86ef694f500e". |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
Annotations already declare readOnly/idempotent/non-destructive, so safety is covered. The description adds genuinely new behavior: that output is truncated on a structural boundary when sections is omitted, which is important context an agent cannot get from annotations or schema.
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?
Three tight sentences, front-loaded with what the tool produces and followed by the operational constraint. No filler.
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?
No output schema exists, and the description does characterize the return (a design.md document, possibly truncated). A brief note on cache/refresh interaction or size limits would close the remaining gap.
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% and the sections enum is fully documented in the schema, so the baseline is 3. The description reinforces that sections is honoured and that omitting it yields everything, but adds no syntax or ordering detail beyond the schema.
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?
States a specific verb (render) and resource (a style as a design.md document), which is a distinct output format. However, it never contrasts with the sibling refero_get_style, so an agent must infer which of the two returns what.
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?
Gives implied usage guidance around budget (request only the sections you need) and the default full-document behavior, but never states when to pick this tool over refero_get_style or refero_match_style.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
refero_get_styleGet a style as structured dataARead-onlyIdempotent
Return the parsed design system plus the measured tokens scraped from the live site (colours, fonts, radii, spacing) as JSON. Prefer refero_get_design_md when you want prose to feed into a document.
| Name | Required | Description | Default |
|---|---|---|---|
| refresh | No | Bypass the local cache and refetch (conditional request). | |
| style_id | Yes | Style UUID. | |
| include_measured_tokens | No | Include the raw extracted token measurements (default true). |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
Annotations cover safety (readOnly, idempotent, non-destructive) and open-world access. The description adds the semantic distinction of structured JSON vs. prose, which is useful, but doesn't mention caching behavior or that refresh bypasses cache (that's only in the schema). With annotations already covering the safety profile, this is adequate but not rich.
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?
Two tight sentences: first states what is returned, second routes to the sibling. No waste and front-loaded.
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?
Complete enough for a read-only retrieval tool: it says what data is returned (design system + tokens) and when to use the alternative. It doesn't mention whether results are paginated or cached, but annotations and schema cover most needs.
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%, with descriptions for refresh, style_id, and include_measured_tokens. The description doesn't add parameter detail beyond the schema, so the baseline 3 is appropriate.
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?
States a specific verb+resource: returns parsed design system and measured tokens as JSON. It names the sibling it is not (refero_get_design_md), which helps an agent distinguish the two retrieval tools.
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?
Explicitly states when to prefer the alternative: use refero_get_design_md when prose is wanted for a document. This directly answers when-to-use-this-vs-sibling.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
refero_index_statusRefero index coverageARead-onlyIdempotent
Report how many published styles exist and how many are indexed locally. Call this before concluding that a style does not exist: a miss usually means it has not been indexed yet.
| Name | Required | Description | Default |
|---|---|---|---|
No parameters | |||
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
Annotations cover safety (readOnly, idempotent, non-destructive, open-world), so the description is freed to add value—and it does, by explaining that published vs. indexed counts can diverge and that misses are expected prior to indexing. It does not describe the return shape, but with no output schema and simple counts, that gap is modest.
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?
Two sentences, front-loaded with the core action, then the critical usage constraint. Every clause earns its place; no redundancy or filler.
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 no-param, read-only status tool with no output schema, the description supplies what matters: what is counted and the diagnostic purpose. It would be marginally stronger if it hinted at the expected response fields, but that is a minor gap given annotations already indicate safety and idempotency.
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?
Zero parameters, so baseline is 4 per rubric. The description correctly implies no inputs by describing a purely informational report, adding no confusing parameter hints.
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?
States a specific, concrete purpose: reporting published style count and locally-indexed count. Differentiates from siblings like refero_search_styles and refero_list_style_ids by framing itself as a coverage/diagnostic check rather than a retrieval tool.
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?
Explicitly names the condition for use: 'Call this before concluding that a style does not exist.' It also preempts the most likely misinterpretation ('a miss usually means it has not been indexed yet'), which is textbook when-to-use guidance.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
refero_list_style_idsList style ids from the sitemapARead-onlyIdempotent
Return published style UUIDs and their last-modified timestamps, straight from the public sitemap. Use this to discover ids without reading any style page.
| Name | Required | Description | Default |
|---|---|---|---|
| limit | No | How many ids to return (default 50). | |
| offset | No | Zero-based index into the published list (default 0). | |
| updated_since | No | ISO date; return only styles modified after this date. |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
Annotations already declare readOnly, idempotent, openWorld and non-destructive, so the safety profile is covered. The description adds real value beyond that by disclosing the data source (public sitemap) and the return shape (UUIDs with last-modified timestamps), which tells the agent the data may lag behind live pages. It stops short of stating ordering, pagination semantics, or sitemap refresh cadence.
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?
Two sentences, zero filler, with the return value and its source front-loaded before the usage hint. Nothing repeats the title or annotations.
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?
There is no output schema, so the description correctly spends words on what is returned (UUIDs plus timestamps). That covers the main gap for a no-required-param listing tool; ordering guarantees and whether unpublished styles are excluded are the only notable omissions.
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%, with limit, offset and updated_since each documented including defaults and bounds, so the baseline is 3. The description only alludes to updated_since via 'last-modified timestamps' and adds no format or behavior detail beyond the schema.
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?
States a specific verb and resource ('Return published style UUIDs and their last-modified timestamps') plus the data source ('straight from the public sitemap'). It implicitly separates itself from refero_get_style by noting ids come without reading a style page, but it never names the closest sibling, refero_search_styles, so the boundary between listing and searching is left for the agent to infer.
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 second sentence gives a usage context ('Use this to discover ids without reading any style page'), which implies a cheap discovery workflow. However, it offers no explicit when-not guidance and does not name refero_search_styles as the alternative for filtered lookup, so the choice between list and search remains unstated.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
refero_match_styleMatch a brief to Refero stylesARead-onlyIdempotent
Given a design brief in prose, return the styles that best match it, each with the terms that triggered the match and a short rationale. Use this when the request is qualitative ("I need a dense, data-heavy dashboard") rather than a specific name.
| Name | Required | Description | Default |
|---|---|---|---|
| brief | Yes | The design brief, or a description of the interface you are building. | |
| limit | No | Maximum matches (default 3). | |
| expand | No | Pull this many uncached styles into the local index first (default 50). |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
Annotations already cover the safety profile (readOnly, idempotent, non-destructive, openWorld), so the bar is lower. The description adds real value by disclosing the return shape, which matters because there is no output schema, but it stays silent on the side effect of the 'expand' parameter pulling uncached styles into a local index, which affects latency and network behavior.
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?
Two sentences, zero filler, with the capability statement front-loaded and the routing cue appended. Nothing repeats the title or schema.
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 low-complexity read tool with three well-documented params, the description covers the essentials and compensates for the missing output schema by describing the return payload. It is slightly incomplete on the expand/indexing side effect and on match ordering or scoring.
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%, so all three parameters (brief, limit, expand) are already documented with defaults and bounds. The description adds no format or semantics beyond that, which is the expected baseline when the schema does the heavy lifting.
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?
States a specific verb+resource ('match a design brief ... return the styles') and even previews the return payload (matches, triggering terms, rationale). It implicitly distinguishes itself from name-based lookups with 'rather than a specific name,' but never names the sibling it displaces.
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?
Gives a clear triggering condition ('when the request is qualitative') plus an example query, and implies the when-not case (specific name) without naming the alternative tool. Usable without inference about intent, but routing between refero_search_styles and refero_get_style is left implicit.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
refero_search_stylesSearch Refero stylesARead-onlyIdempotent
Find design styles on styles.refero.design by free text. Matches style names, north-star statements, colours, fonts and URLs on word boundaries. The local index grows on demand, so results improve as more styles are indexed.
| Name | Required | Description | Default |
|---|---|---|---|
| limit | No | Maximum results (default 5). | |
| query | Yes | Free-text query, e.g. "minimal ecommerce" or "brutalist mono". | |
| expand | No | Pull this many uncached styles into the local index first (default 25, capped by REFERO_MAX_FETCHES). |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
Annotations already declare readOnly/idempotent/openWorld, so the safety profile is covered. The description adds genuinely non-obvious behavior: matches occur on word boundaries across names, north-star statements, colours, fonts and URLs, and results improve as the on-demand local index grows.
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?
Three tight sentences with the core purpose front-loaded; the matching-scope and index-growth details follow in priority order. No filler, though the index note borders on implementation detail an agent may not need.
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?
No output schema exists, but the description need not describe return shape for a simple search. Combined with 100% schema coverage and read-only annotations, an agent has enough to call it correctly; only explicit sibling routing is missing.
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 baseline is 3. The description goes slightly beyond by explaining that the index grows on demand and that `expand` pulls uncached styles in, which clarifies the otherwise puzzling interaction between the index and the expand parameter.
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?
States a specific verb and resource ("Find design styles") plus the target site and the input modality (free text). It does not explicitly differentiate itself from siblings like refero_match_style or refero_list_style_ids, so an agent must infer which search variant to pick.
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?
Usage is implied by "by free text" and the note that the local index grows on demand, but there is no explicit when-to-use versus refero_match_style, nor any exclusion or prerequisite guidance. The agent gets context about caching behavior but no routing rule.
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.
5 tool updates
v1.1.0- Changed
refero_get_design_md1 field changed- removed
Input schema / additionalPropertiesRemoved value: -false
- Changed
refero_get_style1 field changed- removed
Input schema / additionalPropertiesRemoved value: -false
- Changed
refero_list_style_ids2 fields changed- removed
Input schema / additionalPropertiesRemoved value: -false - added
Input schema / properties / offset / maximumAdded value: +9007199254740991
- Changed
refero_match_style1 field changed- removed
Input schema / additionalPropertiesRemoved value: -false
- Changed
refero_search_styles1 field changed- removed
Input schema / additionalPropertiesRemoved value: -false
6 tool updates
v1.0.0- First observed
refero_get_design_md - First observed
refero_get_style - First observed
refero_index_status - First observed
refero_list_style_ids - First observed
refero_match_style - First observed
refero_search_styles
TDQS
Scored across 6 tools
Search vs match overlap somewhat (both find styles), but descriptions clearly separate keyword matching from qualitative brief matching. The two retrieval tools (get_design_md for prose, get_style for JSON tokens) are explicitly differentiated, and index_status/list_style_ids target distinct metadata concerns.
Every tool follows the identical refero_<verb>_<noun> pattern: refero_search_styles, refero_match_style, refero_get_style, refero_list_style_ids, etc. No camelCase or naming deviations; totally predictable.
Six tools is well-scoped for a design-style discovery and retrieval server, with each tool earning its place across discovery, matching, and rendering. No redundancy or bloat.
Covers the full read lifecycle: discover ids, search, brief-match, fetch JSON tokens, and render prose. Being a read-only scraper of a public site, no CRUD is needed, though minor gaps (e.g. pagination/batch retrieval) exist.
Maintenance
Related MCP Connectors
A design-style library for AI agents: search real styles, fetch a ready-to-apply design spec.
Turn any live website into brand colors, fonts, design tokens, SVGs, Lottie and paste-ready code.
Serves your design system and coding standards to coding agents, so they stop guessing.
Access and maintain design system docs, tokens, components, skills, and contexts across any project.
Related MCP Servers
AlicenseAqualityBmaintenanceEnables searching the Refero design catalog in plain English and generates DESIGN.md files for any project.636 npm18MIT- FlicenseNot gradedqualityDmaintenanceEnables AI assistants to search, understand, and generate code for design system components by syncing and indexing a component library.-
- AlicenseAqualityBmaintenanceSearches design platforms for UI references and extracts design tokens such as colors, typography, spacing, and shadows from live websites.5MIT
- AlicenseAqualityBmaintenanceEnables AI coding agents to search public design-system catalogs and retrieve only the relevant tokens or sections for a chosen brand, so generated UI matches a specified visual style instead of generic AI output.89 npm1BSD 3-Clause