Connect

8 clients · secrets stay placeholders

JSON (mcpServers)Claude CodeCodexOpenCodeCursorVS CodeGemini CLIGoose

{
  "mcpServers": {
    "open-components": {
      "type": "http",
      "url": "https://mcp.opencomponents.dev/mcp"
    }
  }
}

claude mcp add --transport http open-components https://mcp.opencomponents.dev/mcp

[mcp_servers.open-components]
url = "https://mcp.opencomponents.dev/mcp"

{
  "$schema": "https://opencode.ai/config.json",
  "mcp": {
    "open-components": {
      "type": "remote",
      "url": "https://mcp.opencomponents.dev/mcp",
      "enabled": true
    }
  }
}

{
  "mcpServers": {
    "open-components": {
      "type": "http",
      "url": "https://mcp.opencomponents.dev/mcp"
    }
  },
  "deeplink": "cursor://anysphere.cursor-deeplink/mcp/install?name=open-components&config=eyJ0eXBlIjoiaHR0cCIsInVybCI6Imh0dHBzOi8vbWNwLm9wZW5jb21wb25lbnRzLmRldi9tY3AifQ%3D%3D"
}

{
  "servers": {
    "open-components": {
      "type": "http",
      "url": "https://mcp.opencomponents.dev/mcp"
    }
  }
}

{
  "mcpServers": {
    "open-components": {
      "httpUrl": "https://mcp.opencomponents.dev/mcp"
    }
  }
}

extensions:
  "open-components":
    enabled: true
    name: "open-components"
    type: streamable_http
    uri: "https://mcp.opencomponents.dev/mcp"
    timeout: 300

Quality 86 / 100good

protocol75 · weight 25

warn
protocol.modernnewest supported version is 2025-11-25; 2026-07-28 not supported, older versions are deprecated until 2027-07-28
n/a
protocol.statelessonly applies to 2026-07-28 servers
pass
protocol.transportstreamable HTTP
n/a
protocol.list_ttlonly applies to 2026-07-28 servers

authorizationn/a · weight 15

n/a
auth.prm, auth.as_metadata, auth.cimdno remote uses OAuth
n/a
auth.secret_in_urlno templated URL

tool hygiene100 · weight 30

pass
tools.descriptionsevery tool has a description
pass
tools.description_lengthdescriptions are concise
pass
tools.schemasevery tool has an object input schema
pass
tools.annotations6 of 6 tools declare readOnlyHint or destructiveHint
pass
tools.directory_hintsevery tool declares readOnlyHint, destructiveHint, idempotentHint and openWorldHint
pass
tools.token_costabout 2,366 tokens to load every tool
pass
tools.api_dumptools are not a one-to-one API dump

stability75 · weight 15

warn
stability.changes26 tool changes in 30 days
pass
stability.rug_pullno tool changed its meaning under the same name

dependenciesn/a · weight 15

n/a
deps.known_vulns, deps.mcp_sdk_version, deps.resolvableno npm or PyPI package

6 tools, about 2,366 tokens to load them all · tool set 4f2e8d6ef222 · tools last changed 2026-10-18 · checked 2026-10-19 10:20 UTC

Tool changes

2026-10-18search-docschangedinput schema
2026-10-18list-ruleschangedinput schema
2026-10-18get-reference-implementationchangedinput schema
2026-10-18get-pagechangedinput schema
2026-10-18get-contractchangedinput schema
2026-10-16search-docschangedinput schema
2026-10-16list-ruleschangedinput schema
2026-10-16get-reference-implementationchangedinput schema
2026-10-16get-pagechangedinput schema
2026-10-16get-contractchangedinput schema

Showing the latest 10. Full history: list_changes · trend: quality JSON.

Checks run on what our credential-free, read-only probes observe; tools are never called and no code audit is performed. How it is computed.

Trust 95 / 100

provenance85

liveness98

freshness100

hygiene100

+repository +dns-namespace +website +reachable +uptime-94% +updated-9d-ago

Derived from observable signals (official registry feed and our own credential-free probes); no code audit performed. How it is computed.

Endpoints

remote	auth	reachable	uptime 30d	p50	protocol	last ok
`https://mcp.opencomponents.dev/mcp` streamable-http	none	yes	94%	481 ms	2025-11-25	2026-10-19

Tools (6)

`get-contract`read-only	Returns the contract of a component or a foundation, as YAML: its API (props, slots and events), its DOM contract (element, role, states, keyboard and parts), its tokens, and every rule in its checklist, each with a stable ID (like button/keep-focus), a level (must or should), a scope (component, usage or both) and how to check it. It holds every requirement in a fraction of the page's length, and it's the same file as https://opencomponents.dev/raw/docs/<path>.yaml. WHEN TO USE: first, before you build, review or explain a component or its tokens. WHEN NOT TO USE: for some of the rules only (by scope, layer, level or check), use list-rules. For the reasoning or the examples behind a rule, use get-page with its sections.
`get-page`read-only	Reads a docs page as markdown, whole or just the sections you name. Component pages explain why each rule exists, with examples in React, Vue, Svelte, Angular, Solid, Astro and Vanilla: pass a framework to keep only its examples. WHEN TO USE: for the reasoning, an example or the details behind a rule (like the sections ["Loading"] of the button's page), or for a page without a contract, like the introduction or the roadmap. WHEN NOT TO USE: for the requirements alone, use get-contract or list-rules, which are much shorter. To find which page or section covers a topic, use search-docs. A page longer than about 8,000 tokens, like the button's, returns its outline instead: every heading with its anchor and length, so you can ask for the sections you need. So do sections that are too long to return together.
`get-reference-implementation`read-only	Returns a shipped component's reference implementation: a Vue 3 component that meets every rule in its checklist, the tests that prove it, the helpers it shares with other components and its theme tokens. The live examples on the site run on this code. WHEN TO USE: to build a component that meets the standard, in Vue or by porting it and its tests to another framework, or to see how a rule is met in code. WHEN NOT TO USE: for the requirements, use get-contract. For how the component is used in another framework, use get-page with that framework.
`list-components`read-only	Lists what the Open Components standard covers: the components that have shipped (like Button), the foundations every component follows (like Design Tokens), and the components planned on the Roadmap. WHEN TO USE: to check whether a component has a standard yet, to get the name the other tools take for it, or to see what's planned. WHEN NOT TO USE: if you already know the component, call get-contract directly. To find a topic in the docs, use search-docs. Shipped entries come with their page, their contract and how many rules they have. Planned ones have no page, contract or rules yet: hold them to the three layers and Design Tokens, following the Button's structure, as the build-component prompt does.
`list-rules`read-only	Lists checklist rules as records, filtered by component, ID, scope, layer, level or check. Each rule has a stable ID to cite in reviews and commits, its level (must or should), its scope, its requirement, how to check it (like a unit test, a review or axe's button-name rule) and a link to it. WHEN TO USE: to review code rule by rule, to get only the rules that apply to a task, to look rules up by ID, or to find the ones a tool can check. Pass scope ["component", "both"] to build or review a component, and ["usage", "both"] to review a screen that uses it. WHEN NOT TO USE: for a component's API, DOM contract and tokens, use get-contract, which has every rule too. It returns up to 50 rules at a time, and total counts every rule that matches. When there are more, pass nextOffset as offset, with the same filters, to get the next page. A component meets the standard when it meets every must rule. Each should rule is expected unless there's a good reason not to follow it.
`search-docs`read-only	Searches the whole standard, every section of every page and every checklist rule, and returns the best matches: where each one is, a short excerpt, and for rules, their ID, level and scope. WHEN TO USE: to find where a topic is covered when you don't know the page or the section, like "focus after delete", "spinner", "aria-pressed" or "dark mode". Then read a section with get-page, or rules with list-rules. WHEN NOT TO USE: to list a component's rules, use list-rules. To see which components there are, use list-components. Search for a few specific words rather than a whole question.

Schemas: list_tools.

Similar MCP servers

Official server.json

{
  "name": "com.uxfront/open-components",
  "title": "Open Components",
  "$schema": "https://static.modelcontextprotocol.io/schemas/2025-12-11/server.schema.json",
  "remotes": [
    {
      "url": "https://mcp.opencomponents.dev/mcp",
      "type": "streamable-http"
    }
  ],
  "version": "1.0.0",
  "repository": {
    "url": "https://github.com/uxfront-com/open-components",
    "source": "github"
  },
  "websiteUrl": "https://opencomponents.dev/docs/getting-started/mcp-server",
  "description": "Guidelines for UI components with a perfect UX, DX and AX, whether humans or AI agents write them."
}