Добавить сервер
ethbak/icon-composer-mcp
  1. Каталог MCP
  2. ethbak/icon-composer-mcp

ethbak/icon-composer-mcp

от ethbak
MCP-сервер для быстрой генерации иконок, логотипов и изображений с эффектами Liquid Glass (iOS 26+). Управляет .icon-бандлами, задаёт стеклянные блики, тени, размытие и тёмную тему. Полезен дизайне...
GithubNPMСайт сервера

icon-composer-mcp

Icon Composer MCP

CLI and MCP server for creating images, icons, and logos with Liquid Glass effects (iOS 26+). Not affiliated with Apple .

npm version license platform MCP compatible Glama score

Demo

demo

Key Features

  • Create .icon bundles programmatically from PNG or SVG glyphs
  • Full Liquid Glass support: specular highlights, blur material, shadows, translucency
  • Dark mode + appearance variants with per-appearance fill specializations
  • AI-agent ready: 12 MCP tools + 3 workflow prompts with built-in instructions

Installation

   Claude Code

 

claude mcp add icon-composer -- npx -y icon-composer-mcp
   Claude Desktop

 

Add to ~/Library/Application Support/Claude/claude_desktop_config.json:

{
  "mcpServers": {
    "icon-composer": {
      "command": "npx",
      "args": ["-y", "icon-composer-mcp"]
    }
  }
}
   Cursor

 

Add to .cursor/mcp.json in your project root (or ~/.cursor/mcp.json for global):

{
  "mcpServers": {
    "icon-composer": {
      "command": "npx",
      "args": ["-y", "icon-composer-mcp"]
    }
  }
}

Часто задаваемые вопросы

Инструменты были проиндексированы:
add_layer_to_icon

Добавляет новый слой в существующий .icon bundle. Создаёт новую группу или добавляет в существующую.

Параметры
  • blend_modeenum

    Режим наложения

  • bundle_pathstringобязательный

    Путь к существующему пакету .icon

  • create_groupboolean

    Создаёт новую группу для этого слоя

  • glassboolean

    Участвует в эффектах Liquid Glass.

  • group_indexnumber

    Индекс группы, в которую добавлять (с отсчётом от 0, по умолчанию 0)

  • image_pathstringобязательный

    Путь к файлу изображения для добавления в качестве слоя

  • layer_namestringобязательный

    Название слоя

  • offset_xnumber

    Смещение по X в пунктах

  • offset_ynumber

    Смещение по Y в точках

  • opacitynumber

    Непрозрачность слоя

  • scalenumber

    Масштаб слоя

create_icon

Создаёт .icon-пакет для Apple Icon Composer из изображения переднего плана и цвета фона. Выводит готовый к использованию .icon-пакет для Xcode 26.

Параметры
  • bg_colorstringобязательный

    Цвет фона в hex-формате (например, #0A66C2)

  • blur_materialnumber

    Степень размытия Liquid Glass (0-1, не указывайте, чтобы отключить)

  • bundle_namestring

    Имя для бандла .icon (без расширения)

  • dark_bg_colorstring

    Цвет фона тёмного режима в hex

  • foreground_pathstringобязательный

    Абсолютный путь к изображению переднего плана (PNG или SVG)

  • glyph_scalenumber

    Масштаб глифа переднего плана (0.1-2.0, по умолчанию 1.0 заполняет ~65% области значка в Icon Composer)

  • output_dirstringобязательный

    Каталог, в который записывается пакет .icon

  • shadow_kindenum

    Тип тени

  • shadow_opacitynumber

    Непрозрачность тени

  • specularboolean

    Включает зеркальные блики (Liquid Glass)

  • split_layersboolean

    Разделяет многофигурные SVG на отдельные стеклянные слои (каждая фигура получает независимые эффекты стекла)

  • translucency_enabledboolean

    Включает градиент полупрозрачности.

  • translucency_valuenumber

    Степень полупрозрачности (0-1)

export_marketing

Экспортирует плоское маркетинговое PNG-изображение для App Store Connect. Без эффектов Liquid Glass, без альфа-канала. Создаёт непрозрачный PNG размером 1024x1024 (по умолчанию), готовый к загрузке.

Параметры
  • bundle_pathstringобязательный

    Путь к бандлу .icon

  • output_pathstringобязательный

    Путь вывода для PNG-файла

  • return_imageboolean

    Возвращает отрисованное изображение inline в виде base64 (по умолчанию true).

  • sizenumber

    Размер вывода в пикселях (по умолчанию 1024)

export_preview

Отрисовывает предпросмотр .icon bundle. По умолчанию использует ictool от Apple для рендеринга Liquid Glass (если Icon Composer не установлен, переключается на плоскую композицию). Поддерживает фоны холста и масштабирование.

Параметры
  • appearanceenum

    Режим отображения для предпросмотра (опустите для default/light)

  • apple_presetenum

    Предустановленный фон Apple Icon Composer (переопределяет canvas_bg)

  • bundle_pathstringобязательный

    Путь к бандлу .icon

  • canvas_bgenum

    Простой предустановленный фон холста

  • canvas_bg_colorstring

    Свой hex-цвет для фона холста

  • canvas_bg_imagestring

    Путь к пользовательскому фоновому изображению

  • flatboolean

    Принудительно включает плоский композитный рендеринг (пропускает ictool/Liquid Glass)

  • output_pathstringобязательный

    Путь вывода для PNG-файла

  • return_imageboolean

    Возвращает отрисованное изображение inline в виде base64 (по умолчанию true).

  • sizenumber

    Размер вывода в пикселях

  • zoomnumber

    Уровень масштабирования: размер иконки относительно холста (1.0 = весь холст, 0.5 = половинный размер)

read_icon

Читает и изучает существующий .icon bundle. Возвращает JSON манифеста и список ресурсов.

Параметры
  • bundle_pathstringобязательный

    Путь к бандлу .icon

remove_layer

Удаляет слой или целую группу из .icon-бандла. Опционально очищает осиротевшие файлы ресурсов.

Параметры
  • bundle_pathstringобязательный

    Путь к бандлу .icon

  • cleanup_assetsboolean

    Удаляет осиротевшие файлы ресурсов из каталога Assets.

  • group_indexnumberобязательный

    Индекс группы (с отсчётом от 0)

  • layer_indexnumber

    Индекс слоя внутри группы (нумерация с 0, обязателен при target=layer)

  • targetenumобязательный

    Следует ли удалить один слой или целую группу

render_liquid_glass

Отрисовывает попиксельно точное превью Liquid Glass с помощью ictool от Apple. Выдаёт точно такой же рендер, как iOS 26. Требует установленного Icon Composer.app.

Параметры
  • apple_presetenum

    Предустановленный фон Apple Icon Composer (переопределяет canvas_bg)

  • bundle_pathstringобязательный

    Путь к бандлу .icon

  • canvas_bgenum

    Простой предустановленный фон холста

  • canvas_bg_colorstring

    Свой hex-цвет для фона холста

  • canvas_bg_imagestring

    Путь к пользовательскому фоновому изображению

  • heightnumber

    Выводит высоту в пикселях

  • light_anglenumber

    Угол света в градусах (0-360). Управляет направлением зеркальных бликов и теней.

  • output_pathstringобязательный

    Путь вывода для PNG-файла

  • platformenum

    Целевая платформа

  • renditionenum

    Отрисовка внешнего вида

  • return_imageboolean

    Возвращает отрисованное изображение inline в виде base64 (по умолчанию true).

  • scalenumber

    Коэффициент масштабирования (1x, 2x, 3x)

  • tint_colornumber

    Оттенок тонирования (0-1) для тонированных вариантов.

  • tint_strengthnumber

    Интенсивность тонирования (0-1) для тонированных вариантов

  • widthnumber

    Ширина вывода в пикселях

  • zoomnumber

    Уровень масштабирования: размер иконки относительно холста (1.0 = весь холст, 0.5 = половинный размер)

set_appearances

Задаёт переопределения внешнего вида для тёмного или тонированного режима для заливки фона иконки, группы слоёв или отдельных свойств слоя.

Параметры
  • appearanceenumобязательный

    Режим оформления

  • bg_colorstring

    HEX-код цвета фона для этого оформления (target=fill)

  • blend_modeenum

    Режим наложения для этого оформления (target=layer)

  • blur_materialnumber | null

    Материал размытия для этого оформления (target=group)

  • bundle_pathstringобязательный

    Путь к бандлу .icon

  • fill_colorstring

    HEX-код цвета заливки для этого внешнего вида (target=layer)

  • group_indexnumber

    Индекс группы (для target=group или target=layer)

  • hiddenboolean

    Скрытое состояние для этого внешнего вида (target=group или target=layer)

  • layer_indexnumber

    Индекс слоя внутри группы (обязателен при target=layer)

  • opacitynumber

    Непрозрачность для этого оформления (target=group или target=layer)

  • position_offset_xnumber

    Смещение по X для этого внешнего вида

  • position_offset_ynumber

    Смещение по оси Y для этого внешнего вида

  • position_scalenumber

    Масштаб позиции для этого внешнего вида

  • shadow_kindenum

    Тип тени (target=group)

  • shadow_opacitynumber

    Непрозрачность тени (target=group)

  • specularboolean

    Зеркальность для этого внешнего вида (target=group)

  • targetenumобязательный

    На что настроить внешний вид

  • translucency_enabledboolean

    Включает полупрозрачность для этого внешнего вида (target=group)

  • translucency_valuenumber

    Степень полупрозрачности для этого внешнего вида (target=group)

set_fill

Устанавливает фоновую заливку набора .icon. Поддерживает однотонные цвета и градиенты.

Параметры
  • bundle_pathstringобязательный

    Путь к бандлу .icon

  • colorstring

    HEX-цвет для сплошной заливки или нижней части градиента

  • color2string

    Второй hex-цвет для верхней части градиента

  • fill_typeenumобязательный

    Тип заливки

  • gradient_anglenumber

    Угол градиента в градусах (0 = снизу вверх)

set_glass_effects

Настраивает эффекты Liquid Glass (блик, размытие, тень, полупрозрачность) на группе слоёв в существующем .icon bundle.

Параметры
  • blend_modeenum

    Режим наложения

  • blur_materialnumber | null

    Величина размытия (0-1, null отключает)

  • bundle_pathstringобязательный

    Путь к бандлу .icon

  • group_indexnumber

    Индекс группы для изменения (с отсчётом от 0)

  • lightingenum

    Режим освещения

  • opacitynumber

    Непрозрачность группы

  • shadow_kindenum

    Тип тени

  • shadow_opacitynumber

    Непрозрачность тени

  • specularboolean

    Включает или отключает зеркальные блики

  • translucency_enabledboolean

    Включает полупрозрачность.

  • translucency_valuenumber

    Степень полупрозрачности (0-1)

set_layer_position

Задает масштаб (зум) и смещение слоя или группы внутри пакета .icon. Используется, чтобы приближать или отдалять глиф, а также перемещать его.

Параметры
  • bundle_pathstringобязательный

    Путь к бандлу .icon

  • group_indexnumber

    Индекс группы (с отсчётом от 0)

  • layer_indexnumber

    Индекс слоя внутри группы (отсчёт с нуля, обязателен для target=layer)

  • offset_xnumber

    Смещение по X в пунктах

  • offset_ynumber

    Смещение по Y в точках

  • scalenumber

    Коэффициент масштабирования (0.05-3.0, где 1.0 = полный размер, 0.5 = половина, 2.0 = двойной)

  • targetenum

    Указывает, устанавливать ли позицию для слоя или группы.

toggle_fx

Включает или отключает все эффекты Liquid Glass (блики, тени, размытие, полупрозрачность) во всех группах в пакете .icon одновременно.

Параметры
  • bundle_pathstringобязательный

    Путь к бандлу .icon

  • enabledbooleanобязательный

    true включает все FX, false отключает

1.1.1основная
1.1.0
1.0.1
1.0.0

Выберите клиент, чтобы установить ethbak/icon-composer-mcp:

Любой клиент

Конфиг добавления MCP сервера стандартный, обычно он не меняется вообще, поэтому подходит практически к любому ИИ клиенту, поддерживающему MCP.

{
  "mcpServers": {
    "ethbak-icon-composer-mcp-jaedmcof6h": {
      "command": "npx",
      "args": [
        "-y",
        "icon-composer-mcp"
      ]
    }
  }
}
CursorCursor

Перейдите по ссылке и сервер автоматически будет добавлен в Cursor. Либо откройте/создайте файл ~/.cursor/mcp.json(%USERPROFILE%\.cursor\mcp.json на Windows) и добавьте конфиг сервера:

{
  "mcpServers": {
    "ethbak-icon-composer-mcp-jaedmcof6h": {
      "command": "npx",
      "args": [
        "-y",
        "icon-composer-mcp"
      ]
    }
  }
}
VS Code

Создайте .vscode/mcp.json в проекте (ключ верхнего уровня — servers):

{
  "servers": {
    "ethbak-icon-composer-mcp-jaedmcof6h": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "icon-composer-mcp"
      ]
    }
  }
}

Либо добавьте сервер через терминал:

code --add-mcp "{\"name\":\"ethbak-icon-composer-mcp-jaedmcof6h\",\"type\":\"stdio\",\"command\":\"npx\",\"args\":[\"-y\",\"icon-composer-mcp\"]}"
ClaudeClaude Desktop

Откройте Settings → Developer → Edit Config — это откроет файл claude_desktop_config.json:

  • macOS: ~/Library/Application Support/Claude/claude_desktop_config.json
  • Windows: %APPDATA%\Claude\claude_desktop_config.json

Впишите сервер и полностью перезапустите Claude Desktop:

{
  "mcpServers": {
    "ethbak-icon-composer-mcp-jaedmcof6h": {
      "command": "npx",
      "args": [
        "-y",
        "icon-composer-mcp"
      ]
    }
  }
}
Claude CodeClaude Code

Добавьте сервер одной командой в терминале:

claude mcp add ethbak-icon-composer-mcp-jaedmcof6h -- npx -y icon-composer-mcp

Либо через JSON-конфиг:

claude mcp add-json ethbak-icon-composer-mcp-jaedmcof6h "{\"command\":\"npx\",\"args\":[\"-y\",\"icon-composer-mcp\"]}"
CodexCodex

Добавьте сервер командой в терминале:

codex mcp add ethbak-icon-composer-mcp-jaedmcof6h -- npx -y icon-composer-mcp

Либо вручную в ~/.codex/config.toml(%USERPROFILE%\.codex\config.toml на Windows):

[mcp_servers.ethbak-icon-composer-mcp-jaedmcof6h]
command = "npx"
args = ["-y", "icon-composer-mcp"]
PerplexityPerplexity

MCP доступен подписчикам Perplexity Pro / Max / Enterprise. Локальные серверы — только в приложении для macOS.

  1. Откройте Настройки аккаунта → Connectors.
  2. Установите вспомогательное приложение PerplexityXPC (один раз).
  3. Нажмите Add Connector → вкладка Simple.
  4. В поле Server Name укажите ethbak/icon-composer-mcp, а в поле команды запуска — строку ниже:
npx -y icon-composer-mcp

Нажмите Save и дождитесь статуса Running.

WindsurfWindsurf

Откройте Windsurf Settings → Cascade → MCP Servers или отредактируйте файл ~/.codeium/windsurf/mcp_config.json:

{
  "mcpServers": {
    "ethbak-icon-composer-mcp-jaedmcof6h": {
      "command": "npx",
      "args": [
        "-y",
        "icon-composer-mcp"
      ]
    }
  }
}
ClineCline

В панели Cline нажмите иконку MCP Servers → Configure → Configure MCP Servers (или отредактируйте ~/.cline/mcp.json) и добавьте сервер:

{
  "mcpServers": {
    "ethbak-icon-composer-mcp-jaedmcof6h": {
      "command": "npx",
      "args": [
        "-y",
        "icon-composer-mcp"
      ],
      "disabled": false,
      "autoApprove": []
    }
  }
}
Continue

Создайте файл в .continue/mcpServers/ (например ethbak-icon-composer-mcp-jaedmcof6h.yaml) или добавьте блок в config.yaml. MCP работает только в режиме agent:

mcpServers:
  - name: ethbak-icon-composer-mcp-jaedmcof6h
    command: npx
    args:
      - "-y"
      - "icon-composer-mcp"
Zed

Выполните agent: add context server или откройте настройки (zed: open settings file) и добавьте сервер в объект context_servers:

{
  "context_servers": {
    "ethbak-icon-composer-mcp-jaedmcof6h": {
      "command": "npx",
      "args": [
        "-y",
        "icon-composer-mcp"
      ]
    }
  }
}

Похожие MCP-сервера

musepy/genable

musepy/genable

от musepy

Genable — MCP сервер, превращающий текстовый запрос в редактируемые слои Figma: авто-макет, переменные цветов и шрифтов, светлая и темная темы. Полезен дизайнерам и разработчикам для агентных инструментов (Claude Code, Cursor). Совместим с Gemini, Claude, OpenAI.

Astro⭐ 3
kenneives/design-token-bridge-mcp

kenneives/design-token-bridge-mcp

от kenneives

MCP сервер для трансляции дизайн-токенов: извлекает из Tailwind, CSS, Figma или W3C DTCG и генерирует темы под Kotlin, SwiftUI, Tailwind и CSS-переменные. Полезен разработчикам и дизайнерам в пайплайне v0 → Figma → Claude Code.

TypeScript⭐ 5
themesberg/flowbite-mcp

themesberg/flowbite-mcp

от themesberg

MCP сервер для работы с компонентами Flowbite на Tailwind CSS. Даёт доступ к 60+ UI-элементам, умеет генерировать тему по hex-цвету и превращать Figma-макет в код. Помогает разработчикам быстрее создавать интерфейсы.

JavaScript⭐ 42
diivi/aseprite-mcp

diivi/aseprite-mcp

от diivi

MCP-сервер для полного управления Aseprite через AI-ассистентов. Содержит 104 инструмента для создания пиксель-арта и анимаций: холст, рисование, слои, палитры, эффекты и экспорт. Автоматизируйте р...

Python⭐ 718
albertnahas/icogenie-mcp

albertnahas/icogenie-mcp

от albertnahas

MCP сервер @icogenie/mcp дает AI-агентам генерировать SVG-иконки по тексту. Помогает разработчикам быстро создавать иконки для интерфейсов в Claude. Поддерживает пакетную работу, библиотеку и ежедневные кредиты.

TypeScript⭐ 8
vkhanhqui/figma-mcp-go

vkhanhqui/figma-mcp-go

от vkhanhqui

Открытый Figma MCP-сервер с полным доступом на чтение и запись через плагин. Не требует API и не имеет лимитов — подходит дизайнерам и разработчикам. Работает с AI-инструментами. Управляйте стилями...

Go⭐ 1178
© Каталог MCP, 2026. Все права защищены.
Проект не аффилирован с Anthropic и любыми упомянутыми продуктами.
Все названия и торговые марки принадлежат их владельцам.
Контакты для связи: hi@mcp-katalog.ru

Лука Никитин