SpritesAdd Sprites to GitHub Copilot
Available on Copilot in VS Code, and Copilot CLI. Any Copilot plan that includes agent mode. You need a Sprites account with Framer already connected — the connector acts on that connection, so GitHub Copilot never handles a Framer credential.
Open the MCP configuration
Run MCP: Add Server from the Command Palette and choose Workspace or Global. Workspace writes .vscode/mcp.json, which is worth committing so the team shares the same connector; Global keeps it to you across every project.
VS CodeCommand PaletteMCP: Add ServerWorkspaceAdd Sprites as an HTTP server
The top-level key is servers, not mcpServers, and a remote endpoint needs an explicit type of http. This is the shape VS Code and Copilot share.
.vscode/mcp.json{ "servers": { "sprites": { "type": "http", "url": "https://mcp.sprites.ai/mcp" } } }Authenticate
VS Code shows an Auth action above the server entry once the file is saved. Run it, sign in to Sprites in the browser window that opens, and approve the scopes.
Spriteswants access on behalf of Copilot- Read your connected ad accounts and site data
- Draft campaigns, creatives and pages for your approval
- Apply only the changes you approve
AllowCancelSwitch Copilot Chat to agent mode
MCP tools are only offered to the agent. Pick Agent from the mode dropdown in Copilot Chat, then open the tool picker and confirm Sprites is listed.
Agent modeCopilot Chat → mode dropdown
Run the first prompt
Ask GitHub Copilot this. It routes to a Sprites door, which reads your Framer account and answers — no account to name, no confirmation to give first.
- With Sprites, write a post on "framer vs webflow for startups" and add it to our Framer blog.
- Ask Sprites which of our Framer blog posts lost position in the last 28 days and why.
- Use Sprites to rewrite the SEO title and description on our three weakest case studies.
- Have Sprites list our Framer CMS collections and tell me which one the changelog lives in.
- With Sprites, plan four posts for next month from the queries we nearly rank for.
Open the Copilot Chat tool picker in agent mode; Sprites appears with its tools, each one toggleable.
Running Framer from GitHub Copilot
The jobs people hand over first, start to finish: what you type, what Sprites does with it, and what comes back to approve.
The monthly content plan
You, in GitHub CopilotWith Sprites, plan four Framer blog posts for next month and write the first.
- Sprites does
- Reads Search Console for queries you nearly rank for, checks keyword data, and picks four gaps your existing posts do not cover.
- You get back
- The plan in the thread and the first post as a draft; approve it and it goes into your blog collection.
Refresh a slipping post
You, in GitHub CopilotAsk Sprites why our "framer templates" post dropped and fix it.
- Sprites does
- Compares its queries and position over the last two periods, reads what now outranks it, and rewrites the body and SEO fields.
- You get back
- The rewrite with its reasons, as a draft; approve it and it replaces the same CMS item, same slug and links.
Clean up default SEO titles
You, in GitHub CopilotUse Sprites to find CMS items still using default SEO titles and write proper ones.
- Sprites does
- Lists the items in each collection and checks their SEO fields against the page content and the queries they get.
- You get back
- The items and proposed titles in the thread; tell Sprites which to apply.
What GitHub Copilot can do with Framer
The same doors, whichever client you are in. Marketing data inside the editor where the tracking code lives, so a conversion event can be checked against what GA4 actually recorded before the pull request is opened.
The post lands in your CMS, not in the chat
A new item in the collection you name — blog, changelog, case studies — with the title, slug, body and SEO fields filled in, instead of text you paste into Framer by hand.
Framer has no MCP server; this is one
Framer’s own route is a connection for coding agents in a terminal. Sprites is a remote MCP server, so the same work runs from Claude, ChatGPT or any other client with one URL.
SEO fields written with the post
Title, meta description and slug produced alongside the body, from the keyword the post targets, rather than left at Framer’s defaults.
Existing items rewritten, not recreated
Point it at a CMS item that is slipping and it updates that item’s fields in place, so the slug and its links survive the refresh.
Search Console in the same conversation
Queries you rank 8–20 for, posts that lost position, and the refresh that would win them back — asked and answered without switching tools.
New posts wait for your approval
Every post or refresh Sprites writes stays a draft until you approve it, in the side panel or in the chat. Only then is it written into your Framer CMS.
How approvals work here
GitHub Copilot renders tool results as text, so a Framer change comes back written out rather than as a card. Nothing is applied until you approve it, and the approval waits for you in Sprites — open it there and the same run continues.
What it reads
- Your Framer CMS collections and the items in them
- Each item’s fields, slug and draft state
- Your site’s published URLs
- Search Console queries, impressions, clicks and position, and keyword data for what you target
What it can change
- New CMS items in the collection you name, with title, slug, body and SEO fields
- Updates to the fields of an existing CMS item
- Posts and refreshes Sprites wrote, only after you approve them
- Single field edits you ask for directly, such as one meta description, applied when you ask
- Not your layouts, components or site settings, and not the publish of your site
When it does not work in GitHub Copilot
Three things go wrong in this client specifically, and each has a one-line fix.
Sprites is configured but Copilot never uses it.
Chat is not in agent mode. Ask mode does not call MCP tools at all.
The config is ignored.
The top-level key is servers. mcpServers is the shape other clients use and VS Code does not read it.
Teammates do not see the connector.
It was added Globally rather than to the Workspace. Move it to .vscode/mcp.json and commit that file; each person still signs in as themselves.
And on the Framer side
Sprites says Framer is not connected.
The connection runs through the MCP plugin, which only works while it is open in the Framer desktop app. Open the project, open the plugin, then ask again. If the connection URL changed, paste the new one into the Framer integration in Sprites.
The collection I named cannot be found.
Sprites matches collections by name. Ask it to list your Framer collections and use the exact name it returns, or name the collection in the same words it has in the Framer CMS.
The post was written but is not in Framer.
It is still a draft. Approve it in the side panel, or tell your agent to approve it, and Sprites writes it into the collection.
Framer and GitHub Copilot: questions
Which URL do I paste into GitHub Copilot?
https://mcp.sprites.ai/mcp. There is one endpoint and every client uses it — every OAuth grant is bound to exactly that address, so a variant of it will not be honoured.
Can GitHub Copilot change my Framer account without asking?
GitHub Copilot renders tool results as text, so a Framer change comes back written out rather than as a card. Nothing is applied until you approve it, and the approval waits for you in Sprites — open it there and the same run continues.
Do I need a Framer API key or developer token?
No. Framer is connected once inside Sprites through Framer (connected through the MCP plugin from the Framer Marketplace), and the connector acts on that connection. GitHub Copilot never sees a credential for it.
Why GitHub Copilot for Framer specifically?
Marketing data inside the editor where the tracking code lives, so a conversion event can be checked against what GA4 actually recorded before the pull request is opened.
Is there an official Framer MCP server?
No. Framer’s own position is that it “doesn’t require a separate MCP server”: it offers an External Agent connection instead, set up with npx @framer/agent, which lets coding agents such as Claude Code, Codex, Cursor, Gemini CLI and Windsurf work on your canvas and CMS. The “MCP” plugin in the Framer Marketplace is made by a third party and says it is not official.
How does Sprites connect to Framer?
Through the MCP plugin from the Framer Marketplace: open it in the Framer desktop app, copy the connection URL it shows, and paste it into the Framer integration in Sprites. Framer has to stay open while Sprites works. Your agent then reaches Framer through the single Sprites URL, alongside every other channel.
Keep going
The same GitHub Copilot connector reaches every other channel — nothing else to add.
Framer, from GitHub Copilot
Paste one URL, sign in once, and the next Framer question you ask GitHub Copilot gets answered from the live account.