Basecoat UI — MCP-сервер для Claude Code: установка
MCP-сервер даёт ИИ-кодингу компоненты Basecoat UI и документацию к ним. Пригодится для HTML-интерфейсов на Tailwind без React.
claude mcp add basecoat-ui-mcp -- npx -y basecoat-ui-mcpЧто делает Basecoat UI
Basecoat UI предоставляет агенту разметку компонентов Basecoat UI и инструкции по применению. Сервер помогает искать компоненты, получать варианты по имени или категории, запрашивать HTML, документацию и код подключения Basecoat CSS. Доступны формы, кнопки, поля, карточки, диалоги, меню команд и другие элементы.
Внутри есть инструменты get_component, list_components, get_usage, get_setup, get_theme_script, search_components и get_category. get_setup выдаёт CDN-подключение для стилевого набора, а get_theme_script — скрипт переключения светлой и тёмной темы. Разметка рассчитана на Basecoat 1.0.2 и plain HTML с Tailwind. Если проект ждёт React-компоненты, этот MCP-сервер их не генерирует.
Какие задачи решает
- найти компонент Basecoat по имени или категории
- получить HTML-вариант кнопки, поля или диалога
- подключить Basecoat CSS через CDN
- добавить переключение светлой и тёмной темы
- уточнить API компонента перед вёрсткой интерфейса
Примеры запросов агенту
- Собери страницу регистрации на Basecoat: карточка, кнопки GitHub и Google, поля email и пароля, переключатель тёмной темы.
- Найди вариант кнопки с контуром и верни готовую HTML-разметку для Basecoat 1.0.2.
- Покажи настройку Basecoat для стилевого набора
novaи скрипт смены темы.
Как установить Basecoat UI
Командой платформы
claude mcp add basecoat-ui-mcp -- npx -y basecoat-ui-mcpКомандой платформы
codex mcp add basecoat-ui -- npx -y basecoat-ui-mcpФайл настроек
{
"mcpServers": {
"basecoat-ui": {
"command": "npx",
"args": [
"-y",
"basecoat-ui-mcp"
]
}
}
}Файл настроек
{
"servers": {
"basecoat-ui": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"basecoat-ui-mcp"
]
}
}
}Командой платформы
gemini mcp add basecoat-ui npx -y basecoat-ui-mcpПо шагам, с командами для каждой платформы: Как подключить MCP-сервер: Claude Code, Codex, Cursor, VS Code, Gemini CLI и другие
Вопросы о Basecoat UI
Как установить Basecoat UI в Claude Code?
Выполните claude mcp add basecoat-ui -- npx -y basecoat-ui-mcp. После этого Claude Code сможет обращаться к MCP-серверу.
Что делает Basecoat UI?
Сервер даёт агенту компоненты Basecoat UI, HTML-разметку и документацию по их использованию. Он также умеет искать компоненты и получать код настройки CSS.
Работает ли Basecoat UI с React?
Basecoat UI рассчитан на plain HTML и Tailwind. React в его разметке не используется.