How to Add PageBolt MCP to Claude Desktop
You're building AI agents with Claude. You want visual proof of what they do. Here's how to add PageBolt MCP to Claude Desktop in 5 minutes.
Step 1: Get Your API Key
- Go to pagebolt.dev
- Sign up (free tier: 100 requests/month)
- Copy your API key from Settings
Step 2: Install PageBolt MCP
Clone the repo:
git clone https://github.com/pagebolt/mcp-server.git
cd mcp-server
npm install
Build:
npm run build
Step 3: Add to Claude Desktop Config
macOS/Linux: Edit ~/.claude/claude_desktop_config.json
{
"mcpServers": {
"pagebolt": {
"command": "node",
"args": ["/path/to/mcp-server/dist/index.js"],
"env": {
"PAGEBOLT_API_KEY": "your_api_key_here"
}
}
}
}
Windows: Same config, adjust path to mcp-server
Restart Claude Desktop. You'll see "pagebolt" in the Tools menu.
Step 4: Use It in Your Agent
const Anthropic = require("@anthropic-ai/sdk");
const client = new Anthropic();
const response = await client.messages.create({
model: "claude-opus-4-5-20251101",
max_tokens: 1024,
tools: [
{
name: "pagebolt_screenshot",
description: "Take a screenshot of a URL",
input_schema: {
type: "object",
properties: {
url: { type: "string" }
},
required: ["url"]
}
}
],
messages: [
{
role: "user",
content: "Take a screenshot of amazon.com"
}
]
});
// Claude will use the tool automatically
// Screenshot returned as base64 image
Step 5: See Your Results
Screenshots appear in Claude Desktop as images. You can:
- View full-page captures
- Extract text with Claude's vision
- Build automation chains
- Create audit trails
Common Patterns
Price monitoring: Use PageBolt to capture competitor pricing pages automatically.
Form automation with verification: Take screenshots before and after form fills to verify submission.
Compliance auditing: Extract PII, verify access controls, flag compliance issues.
That's It
5 minutes. Visual proof. No more wondering what your Claude agents actually saw.
Try it free — 100 requests/month. Build your first MCP integration today.
Top comments (0)