Adding Images to Articles with MCP

When an AI assistant such as Claude is connected to your project through the Model Context Protocol, it can add screenshots and other images to your articles as well as text. This article explains how image uploads work over MCP, and how to let Claude's code sandbox reach the upload address so they succeed.

How image uploads work

The image file never passes through the AI conversation. Instead, the assistant uploads it straight to HelpGuides storage, then asks HelpGuides to publish it. It takes four tool calls (see Model Context Protocol Endpoints for every parameter):

1. create_image_upload returns an upload ID and a private upload link that's valid for 10 minutes and can only be written to.
2. The assistant uploads the file to that link with an HTTP PUT, for example with curl. This is the only step that runs on the assistant's side.
3. finish_image_upload checks the file, publishes it to your CDN and returns its public URL, width and height.
4. add_image_to_article inserts the image into the article, with alt text, where you want it. By default it saves a working copy, so you can review the image in the editor before you publish.

Images must be PNG, JPEG, GIF or WebP files of 5 MB or less. The file type is checked from the file itself, not its name.

Which addresses the assistant needs to reach

Only step 2 makes a direct connection, and it goes to HelpGuides storage at: graffiticms.blob.core.windows.net

The other steps are ordinary MCP tool calls. Claude makes those from its own servers through your connector, so nothing else needs to be allowed. The CDN address the published images are served from only matters to people reading your articles.

Why the upload can fail in Claude

In Claude on the web and in Claude Desktop, Claude runs the upload in a code sandbox in the cloud. That sandbox only connects to addresses your Claude settings allow. If HelpGuides storage isn't allowed, the upload fails before it reaches HelpGuides, usually with an error such as CONNECT tunnel failed, response 403, while create_image_upload itself succeeds.

Claude Code, and other assistants that run on your own computer, upload from your computer instead, so they work without changing any settings.

Allow HelpGuides storage in Claude

To enable file upload of images Allow network egress must be enabled for the graffiticms.blob.core.windows.net domain.

Team and Enterprise plans

An organization owner makes this change once for everyone:

1. Sign in to claude.ai as an owner and go to Organization settings, then Capabilities.
2. Make sure Code execution and file creation is turned on.
3. Under network access, choose Allow network egress to package managers and specific domains.
4. Add graffiticms.blob.core.windows.net to the allowed domains and save.
5. Start a new conversation and ask Claude to add the image again. Conversations that were already open may keep the old settings.

Choosing All domains also works, but it lets Claude reach any site, so allowing just the one domain is safer.

Free, Pro and Max plans

1. Go to Settings, then Capabilities.
2. Turn on Code execution and file creation.
3. Turn on Allow network egress. If your settings show a list of allowed domains, add graffiticms.blob.core.windows.net to it.
4. Start a new conversation and try again.

Claude's settings change from time to time. For the current options, see Anthropic's help article on creating and editing files with Claude.

If the upload is still blocked

• Check that you started a new conversation after changing the setting.
• Check that the domain is entered exactly, with no https:// and no path.
• On Team and Enterprise plans, check that the setting was changed by an owner in Organization settings, not in your personal settings.
• If Claude still reports a 403 from the tunnel or proxy, the block is in Claude, not HelpGuides. Contact your Claude administrator or Anthropic support.

Meanwhile, you can have Claude write the article and save it as a working copy, then add the screenshots yourself in the editor. You can drag, upload or paste them, as described in Working with Images. Or use Claude Code, which uploads from your own computer.

Tips for screenshots

• Crop each screenshot to the part of the screen that matters.
• Don't capture personal data, customer records, API keys or other secrets.
• Ask Claude to place each screenshot directly after the step it illustrates, with alt text that describes what it shows.