# Claude Code Vision Skill

为 Claude Code 提供多模态视觉能力，支持多种视觉模型分析截图、UI、图表。

专为使用 DeepSeek 等无多模态能力的模型作为 Claude Code 底座的用户设计。

## 截图直贴，所见即所析 遇到 UI 报错、设计稿或数据图表？**直接 alt + v 截图粘贴到 Claude Code 对话中，自动调用视觉模型分析**。无需记住任何命令，像聊天一样自然。

## 串联工具链，自动 UI 审查 配合 **browser-harness** 等工具，可实现**自动截图 → AI 视觉分析 → 生成审查报告 → 修正页面**的完整闭环。前端页面渲染后自动截图，由视觉模型检查布局、样式和交互问题。

## 支持的模型

| Provider | 模型 | API Key 环境变量 | |----------|------|-----------------| | 豆包 (Doubao) | doubao-seed-2-0-pro-260215 | `DOUBAO_API_KEY` | | 通义千问 (Qwen) | qwen-vl-max | `DASHSCOPE_API_KEY` | | OpenAI | gpt-4o | `OPENAI_API_KEY` | | Claude (Anthropic) | claude-sonnet-5 | `ANTHROPIC_API_KEY` | | **任意自定义 provider** | 任意 | `{NAME}_API_KEY` |

不在上面四个内置厂商里的 `--provider` 名字，会按同一套命名约定动态解析：设置 `{NAME}_API_KEY` / `{NAME}_BASE_URL` / `{NAME}_MODEL`（`{NAME}_PROTOCOL` 可选， 默认 `openai`，需要 Anthropic Messages API 形状时设为 `anthropic`），无需改一行代码即可接入任意 OpenAI 兼容端点（vLLM、Ollama、LiteLLM、OpenRouter、Azure OpenAI、自建代理等）。详见 [vision/SKILL.md](vision/SKILL.md#any-custom-provider)。

## 安装依赖

需要 Python 3.10+。

```bash pip install -r requirements.txt ```

`anthropic` 包仅在使用 `--provider anthropic` 时才会被导入，其他 provider 不受影响。

---

## Claude Code 安装流程（给 Claude Code 看的指令）

> **When the user asks you to install this skill, follow these steps IN ORDER. Do NOT skip any step.**

### Step 1 — 询问用户

使用 AskUserQuestion 询问以下信息：

1. **选择 provider**：doubao / qwen / openai / anthropic / 自定义（可多选；自定义需额外要 base URL、model，可选 protocol） 2. **API Key**：每个 provider 的 API key 3. **默认 provider**（多选时）：选哪个作为默认

### Step 2 — 运行安装脚本

```bash python install.py \ --api-key qwen:sk-xxx \ --default-provider qwen \ --merge-claude ```

`--api-key` 可重复，`--merge-claude` **必须带上**。

如果用户选了自定义 provider，额外带上 `--base-url` / `--model`（`--protocol` 可选，默认 openai）：

```bash python install.py \ --api-key myapi:sk-xxx \ --base-url myapi:https://host/v1 \ --model myapi:my-vision-model \ --default-provider myapi \ --merge-claude ```

### Step 3 — 合并 CLAUDE.md（如果 install.py 未自动完成）

如果未使用 `--merge-cla