Safari MCP
About
The Safari MCP server gives your agent the ability to know how your code actually renders in the browser by connecting it to a Safari browser window
Details
- Author
- Unknown
- Categories
- Developer Tools
Jump to
- Inspect live page state— Ask your assistant to check the current URL, title, and loading status viapage_infoor extract page text withget_page_content.
- Debug console and network issues— Have your agent pull buffered console logs withbrowser_console_messagesor review request summaries and details vialist_network_requestsandget_network_request.
- Interact with the page— Direct your assistant to click, type, scroll, or hover usingpage_interactions, or handle JavaScript dialogs throughbrowser_dialogs.
- Test responsive design— Ask your agent to emulate a CSS media type like “print” withset_emulated_mediaor adjust the viewport usingset_viewport_sizeto verify layout at different sizes.
- Capture visual evidence— Instruct your assistant to take a PNG screenshot withscreenshotor run custom checks by executing JavaScript viaevaluate_javascript.
- Manage browser tabs— Have your agent open, switch, or close tabs usingcreate_tab,switch_tab, andclose_tab, or navigate to a URL and wait for it to load withnavigate_to_urlandwait_for_navigation.
Update:InSafari 27 betaandSafari Technology Preview 247, we’re introducing the Safari MCP server — a Model Context Protocol server for web developers that makes your web development and debugging workflow faster and more powerful. We know agents are increasingly integral to the coding process and the Safari MCP server gives your agent the ability to know how your code actually renders in the browser by connecting it to a Safari browser window.
Any MCP-compatible client can connect to the Safari MCP server. By connecting your agent to a Safari browser window, your agent can emulate what your users experience, giving it the information it needs to debug more autonomously, like access to the DOM, network requests, screenshots, and console output.
It speeds up your debugging process and lets you stay in the comfort of your terminal, which means fewer rounds of hopping windows and typing prompts to debug your code.
If you build for the web, then you know about the debugging dance. It usually goes something like this:
You see something wrong with your site in the browser. You open the console to hunt it down. You click into the styles tab. You see what’s broken. You go back to your code to fix it. Or maybe you take a screenshot, detail the problem to your agent, and let it do the fixing for you. Hopefully it gets it right, the bug is fixed, and you can move on.
But when it isn’t fixed, you go through the workflow again — Browser. Prompt. Agent.
And again and again, until you finally squash the bug.
Regardless of the browser or tools you use, the debugging workflow is a lot of clicks, tools, and window hopping to make a single fix, but it doesn’t have to be that way. If you’re already using agents in your development workflow, the Safari MCP server makes your debugging faster and more efficient.
The Safari MCP server enables your agent to do more debugging and troubleshooting on its own. Here are just a few examples of what it can help with:
Web development in Safari. The next time you develop in Safari, you’ll benefit from an upgraded workflow. Your agent already helps you with your code, now it can do even more by checking out how your code actually renders in Safari.
Improve compatibility with Safari.Testing in just one browser means missing potential bugs in another, giving those users a subpar experience. With the Safari MCP server, your agent can open your site in Safari, inspect computed styles, check layout, and compare it against what you expect without switching windows.
Analyze performance.See what parts of your site are slowing things down. The Safari MCP server lets your agent evaluate JavaScript on the page to surface performance metrics, like navigation timing and resource load times, so it can pinpoint what’s slowing your site down and work on the right fix.
Check for accessibility.The Safari MCP server lets your agent check for common accessibility issues like missing labels, improper ARIA attributes, and poor contrast, so you can catch problems that impact your users.
Verify any user state.Know that the page is working and looking as it should. Your agent can check the state of the form, query an element using a selector, confirm specific interactions, show different states of a checkout flow, and more. Spend less time on these manual checks and empower the agent to do it for you.
These are just a few of the use cases. However you decide to implement it, the Safari MCP server helps your agent do more for you and reduce all the back and forth that web development often requires. An easier workflow means more bugs squashed, happier users, and a better product.
Here are the available tools and what they do:
With the Safari MCP server, you no longer have to write the perfect prompt, carefully describing to your agent what you’re experiencing in the browser. You can give your agent the ability to find out for itself.
If you’re using Claude, you can use the following command in your terminal:
claude mcp add safari-mcp -- "/usr/bin/safaridriver" --mcp
If you’re using Codex, you can use the following command in your terminal:
codex mcp add safari-mcp -- "/usr/bin/safaridriver" --mcp
For other agents, you can put the following in your mcp.json or config.json file.
{ "mcpServers": { "safari-mcp": { "command": "/usr/bin/safaridriver", "args": ["--mcp"] } } }
First, you’ll need to installSafari Technology Preview. Once installed, make sure you enable Safari Settings > Advanced > Show features for web developers. Then go to Safari Settings > Developer > Enable remote automation and external agents.
If you’re using Claude, you can use the following command in your terminal:
claude mcp add safari-mcp-stp -- "/Applications/Safari Technology Preview.app/Contents/MacOS/safaridriver" --mcp
If you’re using Codex, you can use the following command in your terminal:
codex mcp add safari-mcp-stp -- "/Applications/Safari Technology Preview.app/Contents/MacOS/safaridriver" --mcp
For other agents, you can put the following in yourmcp.jsonorconfig.json:
"safari-mcp-stp": { "command": "/Applications/Safari Technology Preview.app/Contents/MacOS/safaridriver", "args": ["--mcp"] }
Note that while the above code names the serversafari-mcp-stp, you can name it whatever you like, even justsafari. Once you have the Safari MCP server installed, try one of the following prompts:
While each agent works a little differently, it shouldn’t need to be told to use the Safari MCP server explicitly — it’ll figure it out on its own. Simple prompts like the ones above are enough to kickstart the MCP.
Here’s how a conversation with an agent using the Safari MCP server might go:
You: Got a bug report — something’s broken in Safari on the flight page. Can you figure out what’s going on?
Agent: I found two distinct bugs on the flight page in Safari. Want me to fix them both?
You: Yes. Anything else here that might be causing problems for Safari users?
Agent: Yes, two more things worth flagging. The results reveal animation is silently broken and the API server startup log is wrong. Should I tackle both as well?
All you need is an initial request to get started, and with the help of the Safari MCP server, your agent can take it from there.
The Safari MCP server runs entirely on your local machine and makes no network calls of its own. It also does not have access to your personal information in Safari (e.g. AutoFill or other browser activity). When it captures page content, screenshots, or console logs, that data goes directly to the agent you’re running — not to Apple. What happens to that data from there depends on the agent and model you’re using. As with any agent you give access to your browser, only use ones you trust.
There are many ways to build for the web, both with and without AI. If AI is a part of your workflow, we think this tool will help make it even more productive. And if it isn’t, that’s OK too.
By creating this resource, we hope to make it easier than ever to test and debug in Safari by helping your agent understand how things look and work in the browser.
If you end up giving it a try or if this is your first time using an MCP server, let us know what you think.
Find us online: Saron Yitbarek onBlueSky, Jen Simmons onBluesky/Mastodon, and Jon Davis onBluesky/Mastodon. If you run into any issues, file aWebKit bug report. Filing issues really does make a difference.
This is a web browser that enables your coding agent, such as Claude Code, to visit websites on your behalf and assist you in identifying bugs or creating UI test cases.
Create crafted UI components inspired by the best 21st.dev design engineers.
Bring agent evaluations, observability, and synthetic test set generation directly into your IDE for free with Galileo's new MCP server
An MCP server to help AI assistants to answer questions and generate AccelByte Extend SDK code more effectively .
MCP server for AI Diagram Maker — generate beautiful software engineering diagrams directly inside Cursor, Claude Desktop, Claude Code, or any MCP-compatible AI agent
ALAPI MCP Tools,Call hundreds of API interfaces via MCP
AI-powered SVG animation generator that transforms static files into animated SVG components using the Allyson platform
MCP server that gives AI assistants on-demand access to 1,500+ amCharts docs, ~300 code examples, and 1000+ class API references.
APIMatic MCP Server is used to validate OpenAPI specifications using APIMatic. The server processes OpenAPI files and returns validation summaries by leveraging APIMatic’s API.
One shared context layer for AI agents and humans — live API specs, DB schemas, and versioned contracts across repos so every agent and teammate works from the same source of truth.
Build and deploy full-stack Next.js apps with 98 tools for React, AWS, and MongoDB
Sign in to leave a review
Use Google, GitHub, or an email account so ratings stay tied to real people.
No reviews posted yet.





