OverlayQA — MCP-сервер для Claude Code: аудит и установка
Проверяет страницы на доступность, контраст и согласованность дизайн-токенов, а затем помогает вести QA-issues. Удобно запускать аудит и разбирать замечания из редактора.
claude mcp add --transport http mcp https://api.overlayqa.com/mcpЧто делает OverlayQA
OverlayQA проверяет публичные URL на нарушения WCAG, проблемы контраста и расхождения дизайн-токенов. Агент может создавать issues по результатам сканирования, назначать ответственных, менять статусы и работать с метками. Для визуального сравнения сервер принимает макет Figma, сохранённый дизайн или изображение.
Для запуска Auto Review и визуального сравнения нужны projectId, публичный url и новый UUID requestId; результат читают через get_review_result. Эти проверки расходуют лимит сканирований и сами по себе не создают issues. Сравнение визуала возвращает выводы ИИ, а не точный вердикт о различиях пикселей. При первом подключении открывается вкладка браузера для входа в аккаунт OverlayQA; срок подключения — 30 дней.
Сервер записывает контекст вызова инструмента, данные аккаунта и проекта, результаты сканирования, URL и сведения о редакторе. Код и переписка с агентом не отправляются, но это повод проверить, какие URL попадают в аудит и кто имеет доступ к проекту. Для Claude Code можно подключить удалённый сервер одной командой.
Какие задачи решает
- проверить страницу на нарушения WCAG
- найти элементы с недостаточным контрастом
- собрать QA-issues по критическим нарушениям
- отфильтровать issues по статусу и серьёзности
- сравнить страницу с макетом Figma
Примеры запросов агенту
- Проверь страницу
https://example.comна нарушения доступности и контраста. - Просканируй сайт и создай issues для серьёзных нарушений.
- Покажи открытые критические issues проекта Acme Web.
Как установить OverlayQA
1Командой платформы: удалённый сервер
claude mcp add --transport http mcp https://api.overlayqa.com/mcp2Командой платформы
claude mcp add overlayqa -- npx -y @overlayqa/mcp1Командой платформы: удалённый сервер
codex mcp add overlayqa --url https://api.overlayqa.com/mcp2Командой платформы
codex mcp add overlayqa -- npx -y @overlayqa/mcpФайл настроек
{
"mcpServers": {
"overlayqa": {
"url": "https://api.overlayqa.com/mcp"
}
}
}{
"mcpServers": {
"overlayqa": {
"command": "npx",
"args": [
"-y",
"@overlayqa/mcp"
]
}
}
}Файл настроек
{
"servers": {
"overlayqa": {
"type": "http",
"url": "https://api.overlayqa.com/mcp"
}
}
}{
"servers": {
"overlayqa": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"@overlayqa/mcp"
]
}
}
}1Командой платформы: удалённый сервер
gemini mcp add -t http overlayqa https://api.overlayqa.com/mcp2Командой платформы
gemini mcp add overlayqa npx -y @overlayqa/mcpПо шагам, с командами для каждой платформы: Как подключить MCP-сервер: Claude Code, Codex, Cursor, VS Code, Gemini CLI и другие
Вопросы о OverlayQA
Как установить OverlayQA в Claude Code?
Выполните claude mcp add --transport http overlayqa https://api.overlayqa.com/mcp. При первом подключении откроется браузер для авторизации в OverlayQA.
Что делает OverlayQA?
MCP-сервер запускает проверки доступности, цветового контраста и дизайн-токенов, а также помогает создавать и обновлять QA-issues.
Что нужно для визуального сравнения?
Нужны projectId, публичный URL и новый UUID requestId. Проверка расходует лимит сканирований, а её результат — выводы ИИ, не пиксельный вердикт для CI.
