Someone reports a layout issue on your Prismic-powered website through Marker.io. Instead of switching between tabs, your AI tool reads the issue and fixes the slice code directly in your project. This guide shows how to connect both Marker.io MCP and Prismic MCP to the same AI tool.
What you can do
When both servers are connected, your AI tool can:
Read Marker.io issues, screenshots, properties, and technical context
Get framework-specific guidance for coding and modeling Prismic slices
Fix slice components, update models, and generate mock data
Mark issues as resolved in Marker.io when the fix is done
The Prismic MCP server is a development tool. It reads your local project files (slice models, config) and helps your AI write correct Prismic code. It supports Next.js, Nuxt, and SvelteKit.
For a full list of Marker.io MCP tools, see MCP Integration (Model Context Protocol).
Before you start
A Marker.io account with at least one website project
Marker.io MCP connected to your AI tool. Follow MCP setup guides if you haven't done this yet.
A Prismic project with Slice Machine set up locally
An MCP-compatible AI tool (Claude Code, Cursor, VS Code, or similar)
Prismic setup
The Prismic MCP server runs locally in your project. No API token or account connection needed. It reads your slice models and config files directly from disk. See the Prismic MCP documentation for details.
Add to your AI tool
Run this from your Prismic project directory.
Example for Claude Code
claude mcp add --transport http marker-io https://connect.marker.io/mcp claude mcp add prismic -- npx -y @prismicio/mcp-server@latest
No authentication needed. The server starts automatically when your AI tool connects.
Using a different AI tool? See MCP setup guides for Marker.io and add the Prismic server alongside it.
Workflow: fix a slice issue
Here's what a typical workflow looks like once both servers are connected.
A reporter submits an issue in Marker.io: "The hero section is missing the subtitle field on mobile."
In your AI tool, ask: "List open issues from Marker.io."
The AI reads the issue details and screenshot.
Ask: "Check the hero slice model and fix the issue."
The AI uses the Prismic MCP to understand the slice model and updates the component code.
Ask: "Mark the Marker.io issue as resolved."
That's it. No tab switching, no copy-pasting.
Tips
You can ask the AI to handle multiple issues in a single prompt.
The AI can read Marker.io screenshots to understand visual context, not just text descriptions.
The Prismic MCP helps with slice code, models, and mocks. For content changes (fixing typos in text), edit the content directly in the Prismic dashboard.
Need Help?
If you have any questions, comments, or corrections, chat with us at the bottom right of our web pages.