Building a Visual Content Pipeline with Claude Code

Developer-focused content — documentation sites, project blogs, changelogs with illustrations — benefits from a consistent visual language. Producing that visually requires research (what do similar projects do?), generation (actually making the images), and integration (saving files, updating templates). Claude Code can run the whole pipeline with AgentPatch providing the web search and image generation tools.

Why This Matters

A content pipeline that requires five different tools is one that usually doesn’t get done consistently. When the steps live inside Claude Code, driven by natural language requests, the barrier is lower and the process is repeatable.

AgentPatch gives Claude Code access to Google Search, Google Image Search, Recraft image generation, and Google News through a single MCP connection. All of them can be invoked as steps in a broader task.

Setup

Install the AgentPatch CLI (zero dependencies, Python 3.10+):

pip install agentpatch

Set your API key:

export AGENTPATCH_API_KEY=your_api_key

Then use it:

ap search "web search"
ap run agentpatch google-search --input '{"query": "test"}'

Get your API key from the AgentPatch dashboard.

Run this command to add AgentPatch as an MCP server:

claude mcp add -s user --transport http agentpatch https://agentpatch.ai/mcp \
  --header "Authorization: Bearer YOUR_API_KEY"

Replace YOUR_API_KEY with your actual key from the AgentPatch dashboard. Claude Code discovers all AgentPatch tools automatically.

Example

You maintain a developer blog that covers open-source tooling. You ask Claude Code:

“I’m publishing a post about type-safe SQL in TypeScript. Search for what visual styles other developer blogs use for this kind of content, then generate a header image that would fit — clean, minimal, some kind of abstract representation of typed data or schema structure. Save it to public/blog/images/type-safe-sql-header.png.”

Claude Code:

  1. Calls Google Image Search through AgentPatch to get a sense of the visual landscape
  2. Calls Recraft through AgentPatch to generate the header image based on that context
  3. Writes the image to the specified path in your project

The whole pipeline runs in one session. Claude Code also understands the file structure of your project, so it can update the blog post’s frontmatter to reference the new image.

For a batch workflow:

“I have three unpublished blog posts in content/blog/drafts/. For each one, read the title and intro, generate an appropriate header image, save it to public/blog/images/, and update the frontmatter with the image path.”

Claude Code handles all three posts in sequence.

Wrapping Up

Claude Code becomes a capable visual content pipeline when AgentPatch provides the search and image generation tools. It knows your project structure and can handle file writes, which makes asset integration straightforward. See everything AgentPatch offers at agentpatch.ai.

← Back to blog