MDN MCP Server▌
by MDN Team
Integrate MDN documentation into your AI tools.
The MDN MCP server is an open standard that allows AI tools to connect to external data sources, providing accurate and up-to-date web platform information. It enhances the capabilities of coding agents by integrating MDN's documentation and browser compatibility data directly into development environments. Currently experimental, it aims to streamline access to the latest web standards without leaving your preferred tools.
github stars
★ —
Both formats append explainx.ai attribution and the canonical URL for this MCP server listing.
best for
- / General purpose MCP workflows
capabilities
what it does
The MDN MCP server is an open standard that allows AI tools to connect to external data sources, providing accurate and up-to-date web platform information. It enhances the capabilities of coding agents by integrating MDN's documentation and browser compatibility data directly into development environments. Currently experimental, it aims to streamline access to the latest web standards without leaving your preferred tools.
how to install
Use the command 'claude mcp add --transport http mdn https://mcp.mdn.mozilla.net/' to integrate with Claude Code.
readme
Skip to main content Skip to search Auth0 by Okta AI agents are the new front-end. Are you ready? Remove bottlenecks and ship faster with Auth0. Start Building Ad
HTML
CSS
JavaScript
Web APIs
All
Learn
Tools
About Blog
Log in MDN Blog Introducing the MDN MCP server
Theme
English (US) In this article Why we built the MDN MCP How to use the MDN MCP What difference does the MCP make? Get involved What's next Auth0 Secure humans, AI agents, & whatever is next Auth0 provides a secure, reliable, and scalable identity foundation, so you can focus on building. Start Building Ad A headline Introducing MDN MCP server above a terminal window titled Light-dark CSS function for images, showing a prompt asking how to use the light-dark() CSS function for images and which browsers support it, with a note that the mdn tool was called 4 times, followed by an answer explaining that light-dark() takes two image values and works anywhere an image is accepted. The MDN logo appears on the right. Introducing the MDN MCP server Author avatarThe MDN Team June 15, 2026 4 minutes read We're excited to announce the release of the MDN MCP server. MCP (Model Context Protocol) is an open standard that enables AI tools to connect to external data sources. The MDN MCP server uses this protocol to bring MDN's documentation and browser compatibility data directly into your AI agent or IDE.
Why we built the MDN MCP More and more AI tools are being integrated into web development workflows, but they can surface outdated web platform information based on their training data and knowledge cutoff.
For example, an LLM or coding agent may not know that a feature like @view-transition CSS at-rule exists, or whether it has reached "Widely Available" baseline and is safe to use across browsers.
The MDN MCP gives your coding agent access to accurate, up-to-date web platform information. It also makes it easier for you to access the latest documentation without leaving your preferred tools.
The server is currently experimental. See our privacy notice for details about data handling during this phase.
How to use the MDN MCP The MDN MCP server works with any MCP-compatible client, including:
Editors: VS Code, Zed, and Cursor. Agent CLIs: Claude Code, Codex CLI, and Antigravity CLI (previously Gemini CLI). Chat apps: Claude Desktop. See the links in this list for how to set up MCP with each tool. For installation instructions and other details, check our MDN MCP server page .
As a quick example, to use it with Claude Code, you would run the following:
bash
Copy claude mcp add --transport http mdn https://mcp.mdn.mozilla.net/ We're looking forward to seeing how you integrate it into your web development workflow, and the scenarios where you find it most useful.
What difference does the MCP make? Given the non-deterministic nature of LLMs and the variety of available models, it's often challenging to compare their behavior with or without certain skills, prompts, tools, and MCPs enabled.
We tested Claude Code Opus 4.7 with and without the MDN MCP on a few features recently shipped in Firefox 151, asking how to use the features and what the browser support is. Specifically:
How to use the light-dark() CSS function for images and which browsers support it? How to use the :buffering CSS pseudo-class and which browsers support it? How to use the shadowrootslotassignment attribute on <template> and which browsers support it? How to use the Web Serial API and which browsers support it? We noticed certain patterns in the results. In most cases, the usage notes from Claude Code with and without the MDN MCP enabled were comparable. Some answers which used the MCP were better structured and more complete. For example, the notes for the light-dark() CSS function also included examples with linear gradients that weren't directly mentioned in the question but are also supported.
When it came to browser support information, the winner was clear: the MDN MCP produced much better and more reliable results. Claude Code without the MCP got the browser support right only in one case: for the :buffering pseudo-class. For example, Claude Code without the MCP insisted that the declarative shadowrootslotassignment attribute is supported in Chrome 120 and Safari 18.3, possibly conflating it with the Element.attachShadow()'s slotAssignment option. But in fact, Firefox 151 is the first browser to ship support for this attribute.
Without the MCP, Claude Code also didn't provide any concrete browser support information about using images in the light-dark() function: "support is less uniform than the color variant", while with the MCP, it provided the full table listing Firefox 150 and Chrome (behind a flag) as supported browsers.
The worst performance of Claude Code without the MCP came from the Web Serial API question. Firefox 151 shipped support for the Web Serial API in May 2026. However, Claude Code without the MCP correctly mentioned Chromium-based browsers as supporting this feature, but also insisted that in Firefox it's:
Not implemented (and not on the roadmap — see Mozilla's standards position: "harmful")
With the MCP enabled, Claude Code correctly identified that Firefox 151 ships support for the Web Serial API, in line with the release notes.
Additionally, we noticed that in our tests, responses which used the MDN MCP were roughly twice as fast. Without the MCP, Claude Code had to fetch and parse quite a few HTML pages to find current information, which took some time, but even then didn't provide accurate results.
Get involved Your feedback helps us improve. If you encounter issues, have comments or suggestions, or want to share how you're using the MDN MCP, we'd love to hear from you. Please feel free to come chat with us in the platform channel in our Discord. If you spot any issues, please raise them in the mdn/mcp GitHub repository.
What's next As AI tools become a bigger part of web development workflows, we're committed to making MDN's documentation available wherever you need it. This release is one step toward that goal, and we're excited to continue improving the experience with your input.
Previous post Under the hood of MDN's new frontend Ad Your blueprint for a better internet.
MDN About Blog Mozilla careers Advertise with us MDN Plus Product help Contribute MDN Community Community resources Writing guidelines MDN Discord MDN on GitHub Developers Web technologies Learn web development Guides Tutorials Glossary Hacks blog Website Privacy Notice Telemetry Settings Legal Community Participation Guidelines Portions of this content are ©1998–2026 by individual mozilla.org contributors. Content available under a Creative Commons license.
FAQ
- What is the MDN MCP Server MCP server?
- MDN MCP Server is a Model Context Protocol (MCP) server profile on explainx.ai. MCP lets AI hosts (e.g. Claude Desktop, Cursor) call tools and resources through a standard interface; this page summarizes categories, install hints, and community ratings.
- How do MCP servers relate to agent skills?
- Skills are reusable instruction packages (often SKILL.md); MCP servers expose live capabilities. Teams frequently combine both—skills for workflows, MCP for APIs and data. See explainx.ai/skills and explainx.ai/mcp-servers for parallel directories.
- How are reviews shown for MDN MCP Server?
- This profile displays 53 aggregated ratings (sample rows for discoverability plus signed-in user reviews). Average score is about 4.6 out of 5—verify behavior in your own environment before production use.
Use Cases▌
Extended AI Capabilities
Add new capabilities to Claude beyond text generation
Example
Access external data sources, execute code, interact with tools and services
Transform Claude from chatbot to action-taking agent
Context Enhancement
Provide Claude with access to relevant context and data
Example
Load project documentation, access knowledge bases, query databases
Get more accurate, context-aware responses
Workflow Automation
Automate multi-step workflows combining AI and external tools
Example
Research → Summarize → Create document → Send notification
Complete complex tasks end-to-end without manual steps
Implementation Guide▌
Prerequisites
- ›Claude Desktop 0.7.0+ or Cursor IDE with MCP support
- ›Basic understanding of MCP architecture and capabilities
- ›Access credentials for integrated services (if required)
- ›Willingness to experiment and iterate on configuration
Time Estimate
15-60 minutes depending on server complexity
Installation Steps
- 1.Install MCP server: npm install -g [package-name] or via GitHub
- 2.Add server configuration to ~/.claude/mcp.json
- 3.Provide required credentials and configuration
- 4.Restart Claude Desktop to load new server
- 5.Test basic functionality with simple prompts
- 6.Explore capabilities and experiment with use cases
- 7.Document successful patterns for reuse
Troubleshooting
- ⚠MCP server not loading: Check config syntax, verify installation
- ⚠Connection errors: Check network, firewall, credentials
- ⚠Feature not working: Read server docs, check required parameters
- ⚠Performance issues: Monitor resource usage, check for network latency
- ⚠Conflicts with other servers: Check port assignments, namespace collisions
Best Practices▌
✓ Do
- +Read server documentation thoroughly before setup
- +Start with simple use cases to validate functionality
- +Test in non-production environment first
- +Monitor resource usage and performance
- +Keep servers updated for bug fixes and new features
- +Document configuration for team members
- +Use environment variables for sensitive configuration
✗ Don't
- −Don't grant overly permissive access to MCP servers
- −Don't skip reading security considerations in docs
- −Don't expose sensitive data without proper controls
- −Don't run untrusted MCP servers without code review
- −Don't ignore error messages—investigate root cause
💡 Pro Tips
- ★Combine multiple MCP servers for powerful workflows
- ★Create custom MCP servers for your specific needs
- ★Share successful configurations with team
- ★Use MCP inspector for debugging
- ★Join MCP community for tips and troubleshooting
Technical Details▌
Architecture
Model Context Protocol standardizes how AI hosts (Claude, Cursor) communicate with external tools and data sources through server implementations.
Protocols
- Model Context Protocol (MCP)
- JSON-RPC 2.0
- stdio or HTTP transport
Compatibility
- Claude Desktop
- Cursor IDE
- Custom MCP clients
When to Use This▌
✓ Use When
Use when you need Claude to access external data, execute actions, or integrate with tools. Best for extending AI capabilities beyond conversation.
✗ Avoid When
Avoid when native integrations exist (use official APIs directly), for real-time critical systems, or when security/compliance requires zero external dependencies.
Integration▌
- →Tool composition: Chain multiple MCP tools in workflows
- →Context augmentation: Provide AI with relevant external data
- →Action delegation: Let AI execute tasks on external systems
- →Bidirectional sync: Keep AI context and external systems in sync
Discussion
Product Hunt–style comments (not star reviews)- No comments yet — start the thread.
List & Promote Your MCP Server
Share your MCP server with the developer community
Ratings
4.6★★★★★53 reviews- ★★★★★Pratham Ware· Dec 24, 2024
I recommend MDN MCP Server for teams standardizing on MCP; the explainx.ai page compares cleanly with sibling servers.
- ★★★★★Kaira Wang· Dec 24, 2024
Strong directory entry: MDN MCP Server surfaces stars and publisher context so we could sanity-check maintenance before adopting.
- ★★★★★Kiara Verma· Dec 24, 2024
We evaluated MDN MCP Server against two servers with overlapping tools; this profile had the clearer scope statement.
- ★★★★★Isabella Diallo· Dec 20, 2024
Useful MCP listing: MDN MCP Server is the kind of server we cite when onboarding engineers to host + tool permissions.
- ★★★★★Soo Perez· Dec 16, 2024
MDN MCP Server is a well-scoped MCP server in the explainx.ai directory — install snippets and categories matched our Claude Code setup.
- ★★★★★Lucas Menon· Dec 8, 2024
We wired MDN MCP Server into a staging workspace; the listing’s GitHub and npm pointers saved time versus hunting across READMEs.
- ★★★★★Lucas Iyer· Nov 27, 2024
We evaluated MDN MCP Server against two servers with overlapping tools; this profile had the clearer scope statement.
- ★★★★★Yash Thakker· Nov 15, 2024
Strong directory entry: MDN MCP Server surfaces stars and publisher context so we could sanity-check maintenance before adopting.
- ★★★★★Kaira Nasser· Nov 15, 2024
I recommend MDN MCP Server for teams standardizing on MCP; the explainx.ai page compares cleanly with sibling servers.
- ★★★★★Kaira Liu· Nov 15, 2024
We wired MDN MCP Server into a staging workspace; the listing’s GitHub and npm pointers saved time versus hunting across READMEs.
showing 1-10 of 53