icon-composer-mcp

Name: icon-composer-mcp
Author: ethbak

本地服务

github.com/ethbak媒体与设计624 周前更新

代码仓库

关于 icon-composer-mcp

icon-composer-mcp 是一个命令行工具与 MCP 服务，用于创建带有 Liquid Glass 效果的 Apple .icon 包，适用于 iOS 26 及以上版本。面向需要为应用生成图标与标志的开发者，也可由 AI Agent 调用。项目与 Apple 无关联。

主要功能

01从 PNG 或 SVG 图形创建 .icon 包
02配置高光、模糊、阴影与透光效果
03支持深色模式与外观变体
04提供 12 个 MCP 工具与 3 个工作流提示词
05提供 doctor 命令检查环境

适用场景

01为 iOS 应用生成带 Liquid Glass 效果的图标
02导出 App Store Connect 所需的无透明通道营销图标
03通过 AI Agent 批量调整图标图层与填充

MCP 相关

该服务以 stdio 方式运行，向 MCP 客户端提供创建、编辑、预览和导出 .icon 包的 12 个工具，并附带工作流提示词。

配置

本地服务的配置在各客户端中通用，复制后粘贴到客户端的 MCP 配置文件即可。

mcp.json · 通用配置

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

启动命令npx -y icon-composer-mcp

本地服务需要在你的电脑上安装运行环境（如 Node.js 18+）。各客户端的配置文件位置不同，请参考客户端文档。

安装包

npmicon-composer-mcp1.1.0stdio

工具

收录的工具列表 · 更新于 2 周前

参数	类型	必填	说明
bg_color	string	是	十六进制格式的背景颜色（例如 #0A66C2）
specular	boolean	否	启用镜面高光（Liquid Glass）
output_dir	string	是	写入 .icon 包的目录
bundle_name	string	否	.icon 包的名称（不含扩展名）
glyph_scale	number	否	前景字形的缩放比例（0.1-2.0，默认值 1.0 在 Icon Composer 中填充图标区域的约 65%）
shadow_kind	enum	否	阴影类型neutral \| layer-color \| none
split_layers	boolean	否	将多形状 SVG 拆分为独立的玻璃图层（每个形状都应用独立的玻璃效果）
blur_material	number	否	Liquid Glass 模糊量（0-1，省略则禁用）
dark_bg_color	string	否	十六进制格式的深色模式背景颜色
shadow_opacity	number	否	阴影不透明度
foreground_path	string	是	前景图像的绝对路径（PNG 或 SVG）
translucency_value	number	否	半透明度（0-1）
translucency_enabled	boolean	否	启用半透明渐变

详细介绍

Icon Composer MCP

用于创建带有 Liquid Glass 效果（iOS 26+）的图像、图标和徽标的命令行工具和 MCP 服务。与 Apple  无关。

演示

主要功能

以编程方式从 PNG 或 SVG 字形创建 .icon 资源包
全面支持 Liquid Glass：高光、模糊材质、阴影、半透明效果
深色模式 + 外观变体，支持按外观进行填充特化
为 AI Agent 做好准备：12 个 MCP 工具 + 3 个内置说明的工作流提示词

安装

Claude Code

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

Claude Desktop

添加到 ~/Library/Application Support/Claude/claude_desktop_config.json：

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

Cursor

在项目根目录的 .cursor/mcp.json 中添加（或在全局配置文件 ~/.cursor/mcp.json 中添加）：

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

服务会显示在 Cursor Settings > MCP Servers 中。无需重启。

VS Code

在项目根目录的 .vscode/mcp.json 中添加（或打开 Command Palette > MCP: Open User Configuration 进行全局配置）：

注意： VS Code 使用 "servers"（而非 "mcpServers"），并且需要 "type" 字段。

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

编辑器中会显示启动／停止／重启按钮。首次启动时会提示确认信任。

Windsurf

首先，在 Windsurf Settings > Cascade > Model Context Protocol (MCP) 中启用 MCP。

然后添加到 ~/.codeium/windsurf/mcp_config.json：

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

点击 Windsurf 设置中的刷新按钮以加载服务。

其他 MCP 客户端

该服务使用 stdio 传输。大多数 MCP 客户端使用以下配置格式：

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

或者直接运行服务：

npx -y icon-composer-mcp

仅使用 CLI（无 MCP）

npm install -g icon-composer-mcp
icon-composer --help

工作原理

提供一个图形 — 任意 PNG 或 SVG 徽标／图像
创建 .icon 捆绑包 — 设置背景填充、图层缩放和玻璃效果
Apple 的 ictool 渲染 Liquid Glass — 高光、阴影、深度和半透明效果
导出 — 预览 PNG、App Store 营销图标，或用于 Xcode 的 .icon 捆绑包

要求

Node.js 18+
macOS，并安装 Icon Composer 以渲染 Liquid Glass
```
brew install --cask icon-composer
```
扁平预览、捆绑包创建／编辑和营销导出可在任何平台上运行，无需 Icon Composer

运行 icon-composer doctor 检查设置。

CLI 命令

命令	描述
`create`	从前景图像创建新的 `.icon` bundle
`add-layer`	向现有 bundle 添加图层
`remove`	移除图层或组
`inspect`	读取并显示 bundle 内容
`glass`	配置组的 Liquid Glass 效果
`appearance`	设置深色／着色模式覆盖项
`fill`	设置背景填充（纯色、渐变、自动、无）
`position`	设置图层／组的缩放和偏移
`fx`	开启／关闭所有玻璃效果
`preview`	导出预览 PNG（Liquid Glass 或平面效果）
`render`	通过 ictool 渲染像素级精准的 Liquid Glass
`export-marketing`	导出用于 App Store Connect 的平面 1024x1024 PNG（无 alpha 通道）
`doctor`	检查系统设置和依赖项

详细信息

create — 创建新的 .icon bundle

icon-composer create <foreground_path> <output_dir> --bg-color <hex> [options]

选项	默认值	描述
`--bg-color <hex>`	必填	背景颜色（例如 `"#0A66C2"`）
`--bundle-name <name>`	`AppIcon`	Bundle 名称（不含 `.icon` 扩展名）
`--dark-bg-color <hex>`	—	深色模式背景颜色
`--glyph-scale <n>`	`1.0`	字形缩放比例（1.0 = 标准尺寸，约占图标区域的 65%）
`--specular / --no-specular`	`true`	镜面高光
`--shadow-kind <kind>`	`layer-color`	阴影类型：`neutral`、`layer-color`、`none`
`--shadow-opacity <n>`	`0.5`	阴影不透明度（0–1）
`--blur-material <n>`	—	模糊材质值（0–1）
`--translucency-enabled`	`false`	启用半透明渐变
`--translucency-value <n>`	`0.4`	半透明程度（0–1）

**输出：**创建 <output_dir>/<bundle_name>.icon/，其中包含 icon.json 清单文件和 Assets/ 目录。

add-layer — 向现有 bundle 添加图层

icon-composer add-layer <bundle_path> <image_path> --name <name> [options]

选项	默认值	描述
`--name <name>`	必填	图层名称
`--group-index <n>`	`0`	目标组索引
`--create-group`	`false`	为此图层创建新组
`--opacity <n>`	`1.0`	图层不透明度（0–1）
`--scale <n>`	`1.0`	图层缩放比例
`--offset-x <n>`	`0`	X 轴偏移量（点）
`--offset-y <n>`	`0`	Y 轴偏移量（点）
`--blend-mode <mode>`	`normal`	混合模式（例如 `multiply`、`screen`、`overlay`）
`--glass / --no-glass`	`true`	是否参与 Liquid Glass 效果

支持的格式：.png、.jpg、.jpeg、.svg、.webp、.heic、.heif

remove — 移除图层或组

icon-composer remove <bundle_path> --target <layer|group> --group-index <n> [--layer-index <n>]

inspect — 读取并显示 bundle 内容

icon-composer inspect <bundle_path>

**输出：**打印完整的清单 JSON，并列出所有资源及其大小。

glass — 配置 Liquid Glass 效果

icon-composer glass <bundle_path> [options]

选项	描述
`--group-index <n>`	目标组（默认：`0`）
`--specular / --no-specular`	镜面高光
`--blur-material <n>`	模糊程度（0–1）
`--shadow-kind <kind>`	`neutral`、`layer-color` 或 `none`
`--shadow-opacity <n>`	阴影不透明度（0–1）
`--translucency-enabled / --no-translucency-enabled`	半透明开关
`--translucency-value <n>`	半透明程度（0–1）
`--opacity <n>`	组不透明度（0–1）
`--blend-mode <mode>`	组混合模式
`--lighting <type>`	`combined` 或 `individual`

appearance — 设置深色／着色模式覆盖项

icon-composer appearance <bundle_path> --target <fill|group|layer> --appearance <dark|tinted> [options]

选项	说明
`--target <type>`	`fill`（背景颜色）、`group`（玻璃效果）或 `layer`（单个图层）
`--appearance <mode>`	`dark` 或 `tinted`
`--group-index <n>`	组索引（用于 `target=group` 或 `target=layer`）
`--layer-index <n>`	组内的图层索引（`target=layer` 时必填）
`--bg-color <hex>`	此外观的背景颜色
`--specular / --no-specular`	此外观的镜面效果
`--shadow-kind <kind>`	此外观的阴影类型
`--shadow-opacity <n>`	此外观的阴影不透明度
`--opacity <n>`	此外观的不透明度
`--blur-material <n>`	此外观的模糊材质值（0–1）
`--translucency-enabled / --no-translucency-enabled`	此外观的半透明效果开关
`--translucency-value <n>`	此外观的半透明程度（0–1）
`--hidden / --no-hidden`	此外观的隐藏状态
`--blend-mode <mode>`	此外观的混合模式（target=layer）
`--fill-color <hex>`	此外观的填充颜色（target=layer）
`--position-scale <n>`	此外观的位置缩放比例
`--position-offset-x <n>`	此外观的 X 轴位置偏移
`--position-offset-y <n>`	此外观的 Y 轴位置偏移

fill — 设置背景填充

icon-composer fill <bundle_path> --type <solid|gradient|automatic|none> [options]

选项	说明
`--type <type>`	`solid`、`gradient`、`automatic` 或 `none`
`--color <hex>`	主颜色（用于纯色或渐变底部）
`--color2 <hex>`	次要颜色（渐变顶部）
`--gradient-angle <n>`	渐变角度（度，默认值：`0`）

position — 设置图层/组的缩放和偏移

icon-composer position <bundle_path> [options]

选项	默认值	说明
`--target <type>`	`layer`	`layer` 或 `group`
`--group-index <n>`	`0`	组索引
`--layer-index <n>`	—	图层索引（`--target layer` 时必填）
`--scale <n>`	—	缩放系数（0.05–3.0）
`--offset-x <n>`	—	X 轴偏移（点）
`--offset-y <n>`	—	Y 轴偏移（点）

fx — 切换所有玻璃效果

icon-composer fx <bundle_path> --enable|--disable

一次性启用或禁用每个组的镜面效果、阴影、模糊和半透明效果。

preview — 导出预览 PNG

icon-composer preview <bundle_path> <output_path> [options]

选项	默认值	说明
`--size <n>`	`1024`	输出尺寸（像素）
`--appearance <mode>`	—	`dark` 或 `tinted`
`--flat`	`false`	强制使用平面渲染（跳过 Liquid Glass）
`--canvas-bg <preset>`	—	`light`、`dark`、`checkerboard`、`homescreen-light`、`homescreen-dark`
`--apple-preset <name>`	—	Apple 壁纸：`sine-purple-orange`、`sine-gasflame`、`sine-magenta`、`sine-green-yellow`、`sine-purple-orange-black`、`sine-gray`
`--canvas-bg-color <hex>`	—	自定义背景颜色
`--canvas-bg-image <path>`	—	自定义背景图片
`--zoom <n>`	`1.0`	缩放级别（图标大小相对于画布的比例）

输出： PNG 文件。默认使用 Liquid Glass 渲染（如果未安装 Icon Composer，则回退到平面渲染）。

render — 通过 ictool 渲染 Liquid Glass

icon-composer render <bundle_path> <output_path> [options]

选项	默认值	描述
`--platform <name>`	`iOS`	`iOS`、`macOS` 或 `watchOS`
`--rendition <name>`	`Default`	`Default`、`Dark`、`TintedLight`、`TintedDark`、`ClearLight`、`ClearDark`
`--width <n>`	`1024`	输出宽度
`--height <n>`	`1024`	输出高度
`--scale <n>`	`1`	缩放系数（1x、2x、3x）
`--light-angle <n>`	—	光照角度（0–360）
`--tint-color <n>`	—	色调色相（0–1）
`--tint-strength <n>`	—	色调强度（0–1）
画布选项	—	与 `preview` 相同

需要： 已安装 Icon Composer.app。若未安装，则返回包含安装说明的错误。

export-marketing — 为 App Store Connect 导出

icon-composer export-marketing <bundle_path> <output_path> [--size <n>]

输出： 不含 Alpha 通道的扁平 PNG（避免被 ITMS-90717 拒绝）。默认尺寸为 1024x1024。

doctor — 检查系统设置

icon-composer doctor

输出： 报告 Node 版本、平台、ictool 路径和版本。若缺少 Icon Composer，则显示安装说明。

MCP 工具

工具	描述
`create_icon`	根据前景图像和背景色创建 `.icon` 包
`add_layer_to_icon`	向现有包添加新图层
`remove_layer`	移除图层或组，并可选择清理资源
`read_icon`	检查包清单和资源
`set_glass_effects`	配置高光、模糊、阴影和半透明效果
`set_appearances`	设置深色／色调模式覆盖项
`set_fill`	设置背景填充
`set_layer_position`	调整图层缩放和偏移
`toggle_fx`	一次性启用／禁用所有玻璃效果
`export_preview`	渲染预览 PNG
`render_liquid_glass`	通过 Apple 的 ictool 渲染（需要 Icon Composer）
`export_marketing`	导出适用于 App Store Connect 的扁平不透明 PNG

所有工具均返回 { content: [{ type: "text", text: "..." }], isError?: true }。

详情

create_icon

根据前景图像创建 .icon 包。

参数	类型	必填	默认值	描述
`foreground_path`	string	是	—	PNG 或 SVG 的绝对路径
`output_dir`	string	是	—	输出目录
`bundle_name`	string	否	`AppIcon`	包名称
`bg_color`	string	是	—	背景十六进制颜色
`dark_bg_color`	string	否	—	深色模式背景色
`glyph_scale`	number	否	`1.0`	字形缩放（0.1–2.0）
`specular`	boolean	否	`true`	镜面高光
`shadow_kind`	enum	否	`layer-color`	`neutral`、`layer-color`、`none`
`shadow_opacity`	number	否	`0.5`	阴影不透明度（0–1）
`blur_material`	number	否	—	模糊量（0–1）
`translucency_enabled`	boolean	否	`false`	启用半透明效果
`translucency_value`	number	否	`0.4`	半透明量（0–1）

add_layer_to_icon

`add_layer_to_icon`

向现有资源包添加图层。

参数	类型	必填	默认值	描述
`bundle_path`	string	是	—	`.icon` 资源包的路径
`image_path`	string	是	—	图像文件的路径
`layer_name`	string	是	—	图层名称
`group_index`	number	否	`0`	目标组
`create_group`	boolean	否	`false`	创建新组
`opacity`	number	否	`1.0`	图层不透明度（0–1）
`scale`	number	否	`1.0`	图层缩放比例（0.1–2.0）
`offset_x`	number	否	`0`	X 偏移量
`offset_y`	number	否	`0`	Y 偏移量
`blend_mode`	enum	否	`normal`	混合模式
`glass`	boolean	否	`true`	是否参与玻璃效果

remove_layer

`remove_layer`

移除图层或组。当 target=layer 时，必须提供 layer_index。

参数	类型	必填	默认值
`bundle_path`	string	是	—
`target`	enum	是	—
`group_index`	number	是	—
`layer_index`	number	否	—
`cleanup_assets`	boolean	否	`true`

read_icon

`read_icon`

检查资源包。返回完整的清单 JSON，以及包含大小信息的资源列表。

参数	类型	必填
`bundle_path`	string	是

set_glass_effects

`set_glass_effects`

配置组上的 Liquid Glass。所有效果参数均为可选项，仅更改已提供的值。

参数	类型	默认值	描述
`bundle_path`	string	—	资源包的路径
`group_index`	number	`0`	目标组
`specular`	boolean	—	镜面效果开关
`blur_material`	number\|null	—	模糊（0–1，设为 null 可禁用）
`shadow_kind`	enum	—	`neutral`、`layer-color`、`none`
`shadow_opacity`	number	—	阴影不透明度（0–1）
`translucency_enabled`	boolean	—	半透明效果开关
`translucency_value`	number	—	半透明程度（0–1）
`opacity`	number	—	组不透明度（0–1）
`blend_mode`	enum	—	混合模式
`lighting`	enum	—	`combined` 或 `individual`

set_appearances

`set_appearances`

为背景填充、组效果或单个图层属性设置深色／着色覆盖效果。

参数	类型	必填	描述
`bundle_path`	string	是	Bundle 路径
`target`	enum	是	`fill`、`group` 或 `layer`
`appearance`	enum	是	`dark` 或 `tinted`
`group_index`	number	否	组索引（用于 `target=group` 或 `target=layer`）
`layer_index`	number	否	组内的图层索引（`target=layer` 时必填）
`bg_color`	string	否	此外观的背景颜色（`target=fill`）
`specular`	boolean	否	此外观的镜面效果（`target=group`）
`shadow_kind`	enum	否	阴影类型（`target=group`）
`shadow_opacity`	number	否	阴影不透明度（`target=group`）
`opacity`	number	否	此外观的不透明度（用于 `target=group` 或 `target=layer`）
`blur_material`	number\|null	否	此外观的模糊材质（`target=group`）
`translucency_enabled`	boolean	否	为此外观启用半透明效果（`target=group`）
`translucency_value`	number	否	此外观的半透明程度（`target=group`）
`hidden`	boolean	否	此外观的隐藏状态（用于 `target=group` 或 `target=layer`）
`blend_mode`	enum	否	混合模式（`target=layer`）
`fill_color`	string	否	此外观的填充颜色十六进制值（`target=layer`）
`position_scale`	number	否	位置缩放（0.05–3.0）
`position_offset_x`	number	否	此外观的位置 X 偏移
`position_offset_y`	number	否	此外观的位置 Y 偏移

set_fill

`set_fill`

设置背景填充。

参数	类型	必填	描述
`bundle_path`	string	是	Bundle 路径
`fill_type`	enum	是	`solid`、`gradient`、`automatic`、`none`
`color`	string	否	十六进制颜色（纯色或渐变底部颜色）
`color2`	string	否	渐变顶部颜色
`gradient_angle`	number	否	角度（以度为单位，默认值：`0`）

set_layer_position

`set_layer_position`

调整图层或组的缩放和偏移。

参数	类型	默认值	描述
`bundle_path`	string	—	Bundle 路径
`target`	enum	`layer`	`layer` 或 `group`
`group_index`	number	`0`	组索引
`layer_index`	number	—	图层索引（用于 `target=layer`）
`scale`	number	—	缩放（0.05–3.0）
`offset_x`	number	—	X 偏移
`offset_y`	number	—	Y 偏移

toggle_fx

`toggle_fx`

启用或禁用每个组上的所有玻璃效果。

参数	类型	必填
`bundle_path`	string	是
`enabled`	boolean	是

export_preview

`export_preview`

渲染预览 PNG。默认使用 Liquid Glass，失败时回退到平面渲染。

参数	类型	默认值	说明
`bundle_path`	string	—	Bundle 路径
`output_path`	string	—	输出 PNG 路径
`size`	number	`1024`	输出尺寸（16–2048）
`appearance`	enum	—	`dark` 或 `tinted`
`flat`	boolean	`false`	强制使用平面渲染
`canvas_bg`	enum	—	预设背景
`apple_preset`	enum	—	Apple 壁纸预设
`canvas_bg_color`	string	—	自定义背景十六进制颜色
`canvas_bg_image`	string	—	背景图片路径
`zoom`	number	`1.0`	缩放级别（0.1–3.0）
`return_image`	boolean	`true`	以 base64 内联形式返回渲染后的图片

render_liquid_glass

`render_liquid_glass`

通过 Apple 的 ictool 实现像素级精准的 Liquid Glass 渲染。需要 Icon Composer.app。

参数	类型	默认值	说明
`bundle_path`	string	—	Bundle 路径
`output_path`	string	—	输出 PNG 路径
`platform`	enum	`iOS`	`iOS`、`macOS`、`watchOS`
`rendition`	enum	`Default`	`Default`、`Dark`、`TintedLight`、`TintedDark`、`ClearLight`、`ClearDark`
`width`	number	`1024`	输出宽度（16–2048）
`height`	number	`1024`	输出高度（16–2048）
`scale`	number	`1`	缩放系数（1–3）
`light_angle`	number	—	光照角度（0–360）
`tint_color`	number	—	色调（0–1）
`tint_strength`	number	—	色调强度（0–1）
画布选项	—	—	与 `export_preview` 相同
`return_image`	boolean	`true`	以 base64 内联形式返回渲染后的图片

export_marketing

`export_marketing`

用于 App Store Connect 的平面营销 PNG。无玻璃效果，不含 Alpha 通道。

参数	类型	默认值	说明
`bundle_path`	string	—	Bundle 路径
`output_path`	string	—	输出 PNG 路径
`size`	number	`1024`	输出尺寸（16–2048）
`return_image`	boolean	`true`	以 base64 内联形式返回渲染后的图片

MCP 提示词

提示词	参数	说明
`create-app-icon`	`image_path`、`output_dir`、`brand_color`、`dark_color?`	引导式工作流：从 Logo 创建图标、预览、迭代并导出
`add-dark-mode`	`bundle_path`、`dark_color`	为现有图标添加深色模式，并提供前后对比预览
`export-for-app-store`	`bundle_path`、`output_dir`	导出营销 PNG 和预览图，用于提交至 App Store

示例工作流

创建品牌图标

# Create with brand color
icon-composer create logo.svg ./out --bg-color "#0A66C2"

# Add dark mode
icon-composer appearance ./out/AppIcon.icon --target fill --appearance dark --bg-color "#0D1B2A"

# Configure glass effects
icon-composer glass ./out/AppIcon.icon --specular --shadow-kind layer-color --blur-material 0.3

# Preview
icon-composer preview ./out/AppIcon.icon preview.png

为 App Store 导出

# Marketing icon (flat, no alpha, 1024x1024)
icon-composer export-marketing ./out/AppIcon.icon marketing.png

# The .icon bundle goes into your Xcode project's asset catalog

带玻璃效果的多层图标

# Create base icon
icon-composer create background.svg ./out --bg-color "#1C1C2E"

# Add foreground layers
icon-composer add-layer ./out/AppIcon.icon glyph.svg --name glyph --opacity 0.8
icon-composer add-layer ./out/AppIcon.icon badge.svg --name badge --create-group

# Configure glass per group
icon-composer glass ./out/AppIcon.icon --group-index 0 --specular --blur-material 0.3
icon-composer glass ./out/AppIcon.icon --group-index 1 --specular --shadow-kind neutral

# Render Liquid Glass
icon-composer render ./out/AppIcon.icon glass-preview.png

限制

Liquid Glass 渲染需要 macOS，并安装 Apple 的 Icon Composer.app。平面渲染可在任何环境下使用。
ClearLight/ClearDark 渲染效果会以灰色为背景。Apple 的玻璃透明效果需要 Metal GPU，无法通过 CLI 使用。

架构

src/lib/          Pure library (bundle, manifest, render, ictool)
src/lib/ops-*.ts  Operations layer (MCP result format)
src/cli.ts        CLI (Commander.js, 14 commands)
src/server.ts     MCP server (thin wrapper, 12 tools + 3 prompts)

贡献

# Install dependencies
bun install

# Run tests
bun test              # 175 unit tests
npm run test:mcp      # 16 MCP integration tests

# Build
bun run build

# Visual test gallery
bun src/cli.ts visual-test --out ./gallery

支持 Markdown

登录后评论

第一次接触 MCP？

从协议是什么，到在客户端里装上第一个服务，这几条回答覆盖了大多数入门问题。

阅读入门指南

一个开放协议，规定了 AI 应用如何以统一方式连接外部工具与数据源。客户端负责与模型对话，MCP 服务负责提供工具、资源和提示模板，两者通过标准消息通信，同一个服务可以被不同客户端复用。

icon-composer-mcp

关于 icon-composer-mcp

主要功能

适用场景

MCP 相关

配置

工具

详细介绍

Icon Composer MCP

演示

主要功能

安装

工作原理

要求

CLI 命令

详细信息

MCP 工具

详情

add_layer_to_icon

remove_layer

read_icon

set_glass_effects

set_appearances

set_fill

set_layer_position

toggle_fx

export_preview

render_liquid_glass

export_marketing

MCP 提示词

示例工作流

创建品牌图标

为 App Store 导出

带玻璃效果的多层图标

限制

架构

贡献

评论

第一次接触 MCP？

MCP（Model Context Protocol）是什么？

MCP 服务和客户端有什么区别？

本地服务与远程服务怎么选？

如何在 Claude、Cursor 等客户端中安装服务？

收录的项目经过审核吗？“认证”标识代表什么？

我维护的项目已被收录，怎样认领？

`add_layer_to_icon`

`remove_layer`

`read_icon`

`set_glass_effects`

`set_appearances`

`set_fill`

`set_layer_position`

`toggle_fx`

`export_preview`

`render_liquid_glass`

`export_marketing`