Visuals MCP — MCP-сервер для Claude Code: визуализации и установка
Visuals MCP показывает данные агента в интерактивных таблицах, графиках, деревьях и списках. Пригодится, когда нужно изучить коллекцию или выбрать строки прямо в интерфейсе MCP-клиента.
claude mcp add visuals-mcp -- npx -y @harrybin/visuals-mcpЧто делает Visuals MCP
Сервер отображает таблицы с сортировкой, фильтрами и выбором строк, графики нескольких типов, изображения с метаданными, древовидные структуры и списки с перетаскиванием. Для просмотра коллекций есть режим master-detail: список элементов рядом с таблицей, изображением или текстом. Состояние таблиц и деревьев может возвращаться языковой модели, а графики сообщают хосту о выборе и наведении.
Данные можно копировать или экспортировать: таблицы — в CSV, TSV или PDF, деревья — в HTML или PNG, списки — в текст, CSV или JSON. Типы и действия экспорта различаются по визуализации. Для Claude Code сервер добавляется через npx с пакетом @harrybin/visuals-mcp; без установленного Node.js и доступного npx эта команда не запустится.
Какие задачи решает
- сортировать и фильтровать строки таблицы
- сопоставлять несколько графиков в одном представлении
- просматривать вложенные данные в виде дерева
- выбирать элементы коллекции в режиме master-detail
- переставлять пункты списка перетаскиванием
Примеры запросов агенту
- Покажи эти записи в интерактивной таблице, чтобы я мог отфильтровать строки.
- Построй график по этим данным и добавь к нему ещё один график рядом.
- Представь эту структуру как дерево, чтобы я мог раскрывать узлы.
Как установить Visuals MCP
Командой платформы
claude mcp add visuals-mcp -- npx -y @harrybin/visuals-mcpКомандой платформы
codex mcp add visuals-mcp -- npx -y @harrybin/visuals-mcpФайл настроек
{
"mcpServers": {
"visuals-mcp": {
"command": "npx",
"args": [
"-y",
"@harrybin/visuals-mcp"
]
}
}
}Файл настроек
{
"servers": {
"visuals-mcp": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"@harrybin/visuals-mcp"
]
}
}
}Командой платформы
gemini mcp add visuals-mcp npx -y @harrybin/visuals-mcpПо шагам, с командами для каждой платформы: Как подключить MCP-сервер: Claude Code, Codex, Cursor, VS Code, Gemini CLI и другие
Вопросы о Visuals MCP
Как установить Visuals MCP в Claude Code?
Выполните claude mcp add visuals-mcp -- npx -y @harrybin/visuals-mcp. Команда добавит сервер visuals-mcp через npx.
Что делает Visuals MCP?
Он передаёт MCP-клиенту интерактивные представления данных: таблицы, графики, изображения, деревья, списки и панели master-detail. Состояние выбора и фильтров может возвращаться языковой модели.
С какими платформами работает Visuals MCP?
Сервер заявлен для Claude Code, Codex, Cursor, GitHub Copilot, Windsurf (Devin Desktop), Cline, Zed и Gemini CLI.