Claude 的视觉能力让它能够「看懂」图片——分析截图、解读图表、 识别文档内容，在软件开发和内容处理中有大量实用场景。
支持的图像规格
| 属性 | 规格 |
|---|---|
| 支持格式 | PNG、JPEG、GIF（静态）、WebP |
| 最大文件大小 | 单图 5 MB（Base64 编码前） |
| 最大分辨率 | 无硬性限制，但过大会自动缩放 |
| 单次请求图像数 | 最多 20 张 |
两种传图方式
方式一：Base64 编码（本地文件）
Python：
python
import anthropic
import base64
client = anthropic.Anthropic()
with open("screenshot.png", "rb") as f:
image_data = base64.standard_b64encode(f.read()).decode("utf-8")
message = client.messages.create(
model="claude-sonnet-4-6",
max_tokens=1024,
messages=[{
"role": "user",
"content": [
{
"type": "image",
"source": {
"type": "base64",
"media_type": "image/png", # image/jpeg / image/gif / image/webp
"data": image_data,
},
},
{"type": "text", "text": "这张截图里的错误信息是什么？如何修复？"},
],
}],
)
print(message.content[0].text)TypeScript：
typescript
import Anthropic from "@anthropic-ai/sdk";
import * as fs from "fs";
const client = new Anthropic();
const imageData = fs.readFileSync("error.png").toString("base64");
const response = await client.messages.create({
model: "claude-sonnet-4-6",
max_tokens: 1024,
messages: [{
role: "user",
content: [
{
type: "image",
source: { type: "base64", media_type: "image/png", data: imageData },
},
{ type: "text", text: "描述这张图片中的主要内容" },
],
}],
});方式二：URL 直接引用（在线图片）
python
message = client.messages.create(
model="claude-sonnet-4-6",
max_tokens=1024,
messages=[{
"role": "user",
"content": [
{
"type": "image",
"source": {
"type": "url",
"url": "https://upload.wikimedia.org/wikipedia/commons/thumb/4/47/PNG_transparency_demonstration_1.png/200px-PNG_transparency_demonstration_1.png",
},
},
{"type": "text", "text": "这张图片里有什么？"},
],
}],
)URL 图像会被 Claude 实时下载，需要 URL 公开可访问。 私有图片推荐用 Base64 方式。
多张图片同时分析
python
# 对比两张截图，找差异
with open("before.png", "rb") as f:
before = base64.standard_b64encode(f.read()).decode("utf-8")
with open("after.png", "rb") as f:
after = base64.standard_b64encode(f.read()).decode("utf-8")
message = client.messages.create(
model="claude-sonnet-4-6",
max_tokens=2048,
messages=[{
"role": "user",
"content": [
{"type": "text", "text": "这是重构前的截图："},
{"type": "image", "source": {"type": "base64", "media_type": "image/png", "data": before}},
{"type": "text", "text": "这是重构后的截图："},
{"type": "image", "source": {"type": "base64", "media_type": "image/png", "data": after}},
{"type": "text", "text": "对比两张图，UI 发生了哪些变化？"},
],
}],
)典型应用场景
1. 截图调试（开发利器）
python
# 结合 Claude Code：截图 → 直接分析报错
def analyze_screenshot(screenshot_path: str, question: str) -> str:
with open(screenshot_path, "rb") as f:
img = base64.standard_b64encode(f.read()).decode("utf-8")
msg = client.messages.create(
model="claude-sonnet-4-6",
max_tokens=2048,
messages=[{
"role": "user",
"content": [
{"type": "image", "source": {"type": "base64",
"media_type": "image/png", "data": img}},
{"type": "text", "text": question},
],
}],
)
return msg.content[0].text
# 使用：截图后直接问 Claude
result = analyze_screenshot(
"browser-error.png",
"这个浏览器控制台的错误是什么原因？对应的代码应该如何修改？"
)2. 图表数据提取
你：[上传折线图截图]
把这张图表里的数据提取成 CSV 格式
Claude：
month,sales
2025-01,1234
2025-02,1456
...（准确提取坐标数据）
3. UI 设计分析
python
# 分析竞品 UI
msg = client.messages.create(
model="claude-sonnet-4-6",
max_tokens=2048,
messages=[{
"role": "user",
"content": [
{"type": "image", "source": {"type": "url", "url": competitor_screenshot_url}},
{"type": "text", "text": "分析这个登录页面的 UX 设计：用了哪些设计模式？有什么可以改进的地方？"},
],
}],
)4. 文档/表格识别（OCR+理解）
python
# 识别手写笔记或扫描文档
msg = client.messages.create(
model="claude-sonnet-4-6",
max_tokens=4096,
messages=[{
"role": "user",
"content": [
{"type": "image", "source": {"type": "base64",
"media_type": "image/jpeg", "data": document_b64}},
{"type": "text", "text": "识别并整理这份扫描文档的内容，输出 Markdown 格式"},
],
}],
)图像 Token 计费
图像占用的 Token 数取决于尺寸（尺寸越大 Token 越多）：
| 图像尺寸 | 大约 Token 数 |
|---|---|
| 256×256 | ~170 tokens |
| 512×512 | ~~340 tokens |
| 1024×1024 | ~1300 tokens |
| 1568×1568（最大） | ~1600 tokens |
图像 Token 以输入 Token 计费。 优化建议：提交前将图像压缩到 1024px 以内，可节省 50%+ 费用。
来源：Anthropic 官方文档 - docs.anthropic.com/en/docs/build-with-claude/vision