rendercheck — MCP-сервер для Claude Code: что делает и как установить
Проверяет видимость текста на скриншотах через локальный OCR без вызовов API. Пригодится агентам для валидации UI после правок вёрстки и стилей.
claude mcp add rendercheck -- npx -y @rendercheck/sdkЧто делает rendercheck
Обычные тесты DOM часто пропускают графические дефекты. Элемент остаётся в разметке, но на экране его закрывает соседний блок, либо надпись сливается с фоном из-за слабого контраста. RenderCheck берёт растровые скриншоты PNG или JPEG и сканирует их встроенным движком Tesseract.js на базе WebAssembly прямо на вашей машине.
Сервер открывает для агента два инструмента: verify_text для сверки ожидаемой строки и read_text для считывания всей видимой графики. В сборку включена модель только для английских символов. Поэтому для арабских, японских или ивритских знаков понадобится вручную скачать нужный файл .traineddata и передать путь через langPath.
Для запуска требуется среда Node 18+. Обработка идёт без обращений к сторонним сервисам. Локальный журнал запусков ведётся в файле ~/.rendercheck/usage.jsonl, а отключается он переменной окружения RENDERCHECK_NO_USAGE_LOG=1.
Какие задачи решает
- проверить фактическую видимость текста на скриншоте после изменений в коде
- выявить проблемы с контрастностью надписей по нормам WCAG
- обнаружить перекрытие блоков и ошибки отображения символов валюты
- извлечь текст с экрана без отправки данных во внешние облачные сервисы
Примеры запросов агенту
- Проверь через
verify_text, видна ли сумма «Total: $14.00» на скриншотеcheckout.png. - Прочитай текст с изображения
modal.pngс помощью инструментаread_text. - Убедись, что кнопка «Pay now» в файле
screen.pngчитаема и имеет контрастность не ниже 4.5.
Как установить rendercheck
Командой платформы
claude mcp add rendercheck -- npx -y @rendercheck/sdkКомандой платформы
codex mcp add rendercheck -- npx -y @rendercheck/sdkФайл настроек
{
"mcpServers": {
"rendercheck": {
"command": "npx",
"args": [
"-y",
"@rendercheck/sdk"
]
}
}
}Файл настроек
{
"servers": {
"rendercheck": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"@rendercheck/sdk"
]
}
}
}Командой платформы
gemini mcp add rendercheck npx -y @rendercheck/sdkПо шагам, с командами для каждой платформы: Как подключить MCP-сервер: Claude Code, Codex, Cursor, VS Code, Gemini CLI и другие
Вопросы о rendercheck
Как установить rendercheck в Claude Code?
Выполните в терминале команду claude mcp add rendercheck -- npx -y @rendercheck/sdk.
Что делает MCP-сервер rendercheck?
Он запускает автономный OCR на локальной машине через WebAssembly, позволяя агенту проверять текст и контрастность на скриншотах без обращения к сторонним API.
Нужен ли интернет для распознавания текста?
Нет, обработка картинок происходит локально с помощью Tesseract.js. В комплекте идёт база для английского языка, а файлы для других алфавитов нужно сохранять вручную через параметр langPath.
