1. 桌面应用图标这件事远比想象中讲究macOS 桌面应用图标制作这件事看起来就是画一张图然后拖进 Xcode 里但真上手做过的人都知道从设计稿到最终在 Dock 栏、启动台、访达侧边栏里都清晰锐利中间要跨过好几道坎。我自己第一次给一个 macOS 小工具做图标的时候就踩了一个经典坑只放了一张 1024×1024 的 PNG 进 Assets结果在 Finder 列表视图里图标糊得像蒙了一层雾后来才知道 macOS 对图标有一套非常具体的尺寸矩阵和命名规范缺了哪一档系统就会拿最接近的尺寸去硬缩放糊是必然的。这篇内容就是把我自己从零做一套 macOS 应用图标的完整流程梳理出来包括设计阶段要遵守的网格和圆角规范、用sips和iconutil把一张母版图切成标准 iconset 并打包成.icns、以及最后怎么把它接进 Xcode 工程让打包出来的 App 自动带上图标。涉及的关键词有 macOS、Xcode、icns、iconutil、sips这几个工具基本就是 macOS 图标制作的原生全家桶不需要装任何第三方软件。适合谁看如果你正在做 macOS 原生应用、Electron 打包的桌面工具、或者只是想给自己写的小脚本套个像样的图标这套流程都能直接用。哪怕你完全没接触过命令行我也会把每条命令拆开讲清楚它在干什么保证你能照着抄。整个流程走下来熟练的话十分钟以内能搞定一套图标慢也就半小时比找设计外包快多了。2. 先搞懂 macOS 图标的设计规范别急着画2.1 为什么 macOS 图标不是随便一张方图很多人从 Windows 或者移动端转过来做 macOS 图标第一反应是不就是个圆角矩形吗然后随手画个圆角就交差。但 macOS 的图标规范里圆角半径、留白比例、投影方向都是有讲究的。系统自带的那些应用图标你仔细看会发现它们并不是把内容铺满整个画布而是留了一圈透明的呼吸空间这样在 Dock 栏里排列的时候图标之间才不会挤在一起显得很闷。具体来说macOS 应用图标的标准画布是 1024×1024 像素但实际图形内容通常只占中间大约 824×824 的区域四周各留约 100 像素的透明边距。这个比例不是拍脑袋定的是苹果为了让图标在视觉上和系统图标保持一致的重量感。如果你把图形画满整个 1024 画布放进 Dock 里会明显比旁边的系统图标大一圈看起来特别突兀。圆角方面macOS 的图标圆角半径大约是画布宽度的 22.37%换算到 1024 画布上大概是 229 像素左右。这个数字记不住也没关系你在设计工具里画一个 824×824 的圆角矩形圆角半径设成 185 像素左右视觉上就非常接近系统图标了。我一般会直接拿系统图标的形状做参考把它的轮廓描下来当模板这样最省事也最准。2.2 尺寸矩阵一套图标到底要切多少张这是新手最容易漏掉的部分。macOS 的.icns文件内部其实是一个容器里面装着多个不同尺寸的 PNG系统会根据显示场景自动挑最合适的那一张。如果你只塞一张大图系统在需要小尺寸时就得实时缩放效果差还费性能。标准的 iconset 需要下面这些尺寸注意每个尺寸还分 1x 和 2x 两档2x 是给 Retina 屏用的逻辑尺寸实际像素1x实际像素2x典型使用场景16pt16×1632×32菜单栏、列表小图标32pt32×3264×64Finder 列表视图128pt128×128256×256Finder 图标视图256pt256×256512×512访达大图标、预览512pt512×5121024×1024Dock、启动台、App Store加起来一共 10 张 PNG。命名也有固定格式必须是icon_16x16.png、icon_16x162x.png这种2x后缀表示 Retina 版本。iconutil这个工具就是靠文件名来识别尺寸的名字写错了它直接报错或者打包出来的 icns 缺档。提示16×16 和 32×32 这种超小尺寸直接拿大图缩会糊成一团。我的做法是在设计工具里针对小尺寸单独微调把细节简化、线条加粗保证缩到 16 像素还能看出是什么。这一步偷懒的话最终在 Finder 列表里就是一团色块。2.3 设计阶段的几个实操心得第一母版图一定要用 1024×1024 的 PNG背景透明不要用 JPGJPG 不支持透明通道圆角外面会变成白底。第二导出的时候用 sRGB 色彩空间避免在某些显示器上偏色。第三如果你用的是矢量工具比如 Sketch、Figma、Illustrator记得导出时勾选导出为 PNG并确认尺寸是精确的 1024别让工具自动加了什么边距。我个人的习惯是先在 Figma 里画好 1024 的母版然后一次性导出所有需要的尺寸。Figma 的导出功能可以配置多个倍率但它的命名规则和iconutil要求的不一样所以我一般只导出 1024 这一张剩下的交给sips批量缩放这样命名可控不容易出错。3. 用 sips 和 iconutil 把母版图变成标准 icns3.1 sips 是什么为什么用它来缩放sips是 macOS 自带的图像处理命令行工具全称 Scriptable Image Processing System。它的好处是不依赖任何第三方库系统装好就有而且缩放质量相当不错。相比用 Photoshop 一张张手动导出sips一条命令就能把 1024 的图缩成任意尺寸还能保持透明通道。先确认一下你的母版图准备好了假设叫appicon.png放在桌面。打开终端先cd到图片所在目录cd ~/Desktop然后建一个专门放 iconset 的文件夹名字必须以.iconset结尾这是iconutil的硬性要求mkdir appicon.iconset接下来就是批量生成各个尺寸。我习惯写一个循环但为了让你看清楚每一步在干什么先手动演示几条sips -z 16 16 appicon.png --out appicon.iconset/icon_16x16.png sips -z 32 32 appicon.png --out appicon.iconset/icon_16x162x.png sips -z 32 32 appicon.png --out appicon.iconset/icon_32x32.png sips -z 64 64 appicon.png --out appicon.iconset/icon_32x322x.png这里的-z参数后面跟的是高度和宽度sips -z 16 16就是把图缩成 16×16。注意顺序是先高后宽虽然正方形图无所谓但养成习惯不容易错。--out指定输出路径和文件名。把剩下几档也补上sips -z 128 128 appicon.png --out appicon.iconset/icon_128x128.png sips -z 256 256 appicon.png --out appicon.iconset/icon_128x1282x.png sips -z 256 256 appicon.png --out appicon.iconset/icon_256x256.png sips -z 512 512 appicon.png --out appicon.iconset/icon_256x2562x.png sips -z 512 512 appicon.png --out appicon.iconset/icon_512x512.png sips -z 1024 1024 appicon.png --out appicon.iconset/icon_512x5122x.png跑完之后ls appicon.iconset看一下应该有 10 个文件命名和上面表格里的一一对应。这一步如果文件名错了后面iconutil会直接告诉你缺哪个倒也不难排查。3.2 iconutil 打包成 icnsiconset 文件夹准备好之后打包就一条命令iconutil -c icns appicon.iconset -o appicon.icns-c icns表示输出格式是 icns-o指定输出文件名。跑完你会在当前目录看到一个appicon.icns这就是最终要接进 Xcode 的文件。想验证一下 icns 里到底装了哪些尺寸可以用iconutil -c iconset appicon.icns -o verify.iconset它会反向解包成一个 iconset 文件夹你ls一下就能看到里面所有尺寸确认没缺档。这个反向操作在排查为什么图标显示不对的时候特别有用。注意iconutil对 iconset 里的文件命名极其严格多一个空格、少一个2x都会失败。如果你是从别处拷来的 iconset先ls检查一遍命名再打包。3.3 一条命令搞定的脚本版本如果你经常要做图标手动敲十条sips太累我一般会存一个 shell 脚本把母版图路径当参数传进去自动切图加打包#!/bin/bash # usage: ./make_icns.sh appicon.png SRC$1 NAME${SRC%.*} ICONSET${NAME}.iconset mkdir -p $ICONSET sips -z 16 16 $SRC --out $ICONSET/icon_16x16.png /dev/null sips -z 32 32 $SRC --out $ICONSET/icon_16x162x.png /dev/null sips -z 32 32 $SRC --out $ICONSET/icon_32x32.png /dev/null sips -z 64 64 $SRC --out $ICONSET/icon_32x322x.png /dev/null sips -z 128 128 $SRC --out $ICONSET/icon_128x128.png /dev/null sips -z 256 256 $SRC --out $ICONSET/icon_128x1282x.png /dev/null sips -z 256 256 $SRC --out $ICONSET/icon_256x256.png /dev/null sips -z 512 512 $SRC --out $ICONSET/icon_256x2562x.png /dev/null sips -z 512 512 $SRC --out $ICONSET/icon_512x512.png /dev/null sips -z 1024 1024 $SRC --out $ICONSET/icon_512x5122x.png /dev/null iconutil -c icns $ICONSET -o ${NAME}.icns echo done: ${NAME}.icns把这段存成make_icns.shchmod x make_icns.sh给它执行权限以后./make_icns.sh 任意图.png就能一键出 icns。 /dev/null是把 sips 的冗余输出丢掉让终端干净点。这个脚本我用了很久稳定得很。4. 把 icns 接进 Xcode 工程4.1 两种接入方式Assets 还是直接放 icnsXcode 里给 macOS 应用配图标有两条路。一条是用 Asset Catalog把图标放进Assets.xcassets里的AppIcon集合另一条是直接在 target 设置里指定一个.icns文件。两种都能用但适用场景不太一样。Asset Catalog 的好处是 Xcode 会帮你管理各个尺寸而且和 iOS 的图标管理方式统一如果你做的是跨平台项目用 Assets 更省心。缺点是它要求你把每个尺寸单独拖进去或者用 Xcode 的导入功能稍微麻烦一点。直接放 icns 的好处是简单粗暴一个文件搞定适合那种不想折腾 Assets 的小工具。我个人的选择是如果是正经上架或者长期维护的 App用 Asset Catalog如果是自己用的小工具、脚本套壳直接放 icns 更快。4.2 用 Asset Catalog 配置图标在 Xcode 里打开你的工程找到Assets.xcassets里面应该有一个AppIcon条目。点进去你会看到一个网格每个格子对应一个尺寸从 16×16 到 512×5122x和前面 iconset 的尺寸一一对应。最省事的做法是把之前生成的appicon.iconset文件夹里的 PNG 直接拖进对应的格子里。Xcode 会自动识别尺寸并放到正确的位置。拖完之后每个格子都有图没有警告就说明配好了。如果你嫌一个个拖麻烦也可以只拖 1024 那张到512x5122x的格子然后让 Xcode 自动生成其他尺寸——但我不推荐这么做因为 Xcode 的自动缩放质量一般小尺寸容易糊。还是老老实实用sips切好再拖效果最稳。配好之后去 target 的 General 页面确认App Icon那一栏选的是AppIcon。然后 Build 一下跑起来看看 Dock 栏里的图标对不对。4.3 直接指定 icns 文件的方式如果你走的是直接放 icns 这条路步骤是这样的把appicon.icns拖进 Xcode 工程的导航栏注意勾选 Copy items if needed确保文件被拷进工程目录。然后在 target 的 Build Settings 里搜索ICON找到Asset Catalog App Icon Set Name或者App Icon相关的设置项。更直接的方式是在Info.plist里加一个键CFBundleIconFile值填你的 icns 文件名不带扩展名比如appicon。这样打包出来的 App 就会用这个 icns 作为图标。注意用 icns 方式的时候文件名大小写要一致。macOS 文件系统默认不区分大小写但打包和某些工具链可能会区分养成全小写的习惯最保险。4.4 打包后验证图标有没有生效Build 完之后去 DerivedData 或者你指定的输出目录找到.app文件右键显示包内容进去看Contents/Resources/里有没有你的 icns 文件。如果有说明打包带上了。然后把这个.app拖到 Applications 文件夹再拖到 Dock 栏上看看图标显示是否正常。如果显示的还是默认的空白图标八成是Info.plist里的键名写错了或者 icns 文件名对不上。这时候可以mdls -name kMDItemFSName -name kMDItemContentType 你的App.app看一下系统识别到的图标信息辅助排查。还有一个常见的坑macOS 有图标缓存有时候你换了图标但系统还显示旧的。这时候可以killall Dock重启一下 Dock或者用touch 你的App.app更新一下文件时间戳强制系统重新读取图标。5. 常见问题与排查技巧实录5.1 图标在 Finder 里糊、在 Dock 里正常这个现象基本可以断定是 iconset 缺了小尺寸。Finder 列表视图用的是 16×16 或 32×32如果你只提供了 512 和 1024系统就得硬缩糊是必然的。解决办法就是回到 iconset 那一步确认 10 个尺寸一个不少。用前面说的iconutil -c iconset反向解包验证一下最直接。5.2 iconutil 报错 Failed to generate ICNS这个报错通常有两个原因。一是 iconset 文件夹里文件名不符合规范比如写成了icon_16.png而不是icon_16x16.png二是文件夹里混进了无关文件比如.DS_Store。macOS 的 Finder 会在你浏览过的文件夹里生成.DS_Store打包前记得删掉rm -f appicon.iconset/.DS_Store养成习惯打包前ls -a看一眼有没有隐藏文件。5.3 图标有白边或者圆角外面是白的这是母版图背景不透明导致的。检查你的 PNG 是不是真的透明背景可以用预览打开按CmdI看信息或者用sips -g hasAlpha appicon.png查一下有没有 alpha 通道。如果显示hasAlpha: no说明你的图没有透明通道得回设计工具重新导出。5.4 Xcode 里图标显示正常但打包后不对这种情况多半是 Asset Catalog 的 target membership 没勾对或者 icns 文件没被正确拷贝进 bundle。检查一下Assets.xcassets或者 icns 文件在 Xcode 右侧的 File Inspector 里Target Membership 有没有勾上你的主 target。另外确认 Build Phases 里的 Copy Bundle Resources 包含了图标资源。5.5 常见问题速查表现象最可能的原因快速排查方法Finder 里图标糊iconset 缺小尺寸反向解包 icns 看尺寸iconutil 报错文件名不规范或有隐藏文件ls -a检查命名和 .DS_Store圆角外有白底母版图无透明通道sips -g hasAlpha检查打包后图标不对target membership 没勾看 File Inspector换了图标不更新系统图标缓存killall Dock或 touch app5.6 几个我踩过的坑第一个坑是母版图尺寸不是精确的 1024。有些设计工具导出时会因为画板设置问题导出成 1023 或者 1025sips缩放的时候就会产生非整数比例边缘出现半透明杂边。导出后一定用sips -g pixelWidth -g pixelHeight appicon.png确认一下是 1024×1024。第二个坑是色彩空间。如果你的母版图是 Adobe RGB 或者 P3缩放到小尺寸后颜色可能和预期有偏差。统一用 sRGB 最稳sips也能转换sips -m /System/Library/ColorSync/Profiles/sRGB Profile.icc appicon.png。第三个坑是图标内容太复杂。小尺寸下细节全丢看起来就是一团。我的经验是图标主体元素不要超过三个线条尽量粗颜色对比要强。16×16 那个尺寸能看出轮廓就算成功别指望它能表现细节。6. 关于图标制作的一些延伸经验整套流程走下来核心其实就是三件事设计阶段守好 1024 画布和透明背景、用sips切齐 10 个尺寸、用iconutil打包成 icns 再接进 Xcode。工具都是系统自带的不需要额外装东西这点对保持开发环境干净很重要。我后来把这套流程固化成了一个 Makefile放在项目根目录make icon就自动从design/appicon.png生成 icns 并放到资源目录。这样每次改了设计稿一条命令就能更新图标不用记那些sips参数。如果你团队里有多个人协作把母版图和脚本一起提交到仓库谁都能一键重新生成避免有人手动导出导致尺寸不一致。另外提一句如果你做的是 Electron 或者 Tauri 这类跨平台桌面应用macOS 端的图标同样走 icns 这套流程只是打包配置里指定的字段名不一样。Electron 是在electron-builder的配置里指定icon路径Tauri 是在tauri.conf.json里配。底层用的还是同一个 icns 文件所以这套制作流程是通用的学一次到处能用。最后分享一个小技巧如果你手头只有一张现成的 App 图标想提取它的 icns可以直接右键显示包内容进Contents/Resources/把里面的 icns 拷出来然后用iconutil -c iconset反向解包就能拿到所有尺寸的 PNG 当参考。这个方法在模仿系统图标风格的时候特别好用比对着截图描准多了。
macOS 应用图标制作全流程：从设计规范到 Xcode 集成
1. 桌面应用图标这件事远比想象中讲究macOS 桌面应用图标制作这件事看起来就是画一张图然后拖进 Xcode 里但真上手做过的人都知道从设计稿到最终在 Dock 栏、启动台、访达侧边栏里都清晰锐利中间要跨过好几道坎。我自己第一次给一个 macOS 小工具做图标的时候就踩了一个经典坑只放了一张 1024×1024 的 PNG 进 Assets结果在 Finder 列表视图里图标糊得像蒙了一层雾后来才知道 macOS 对图标有一套非常具体的尺寸矩阵和命名规范缺了哪一档系统就会拿最接近的尺寸去硬缩放糊是必然的。这篇内容就是把我自己从零做一套 macOS 应用图标的完整流程梳理出来包括设计阶段要遵守的网格和圆角规范、用sips和iconutil把一张母版图切成标准 iconset 并打包成.icns、以及最后怎么把它接进 Xcode 工程让打包出来的 App 自动带上图标。涉及的关键词有 macOS、Xcode、icns、iconutil、sips这几个工具基本就是 macOS 图标制作的原生全家桶不需要装任何第三方软件。适合谁看如果你正在做 macOS 原生应用、Electron 打包的桌面工具、或者只是想给自己写的小脚本套个像样的图标这套流程都能直接用。哪怕你完全没接触过命令行我也会把每条命令拆开讲清楚它在干什么保证你能照着抄。整个流程走下来熟练的话十分钟以内能搞定一套图标慢也就半小时比找设计外包快多了。2. 先搞懂 macOS 图标的设计规范别急着画2.1 为什么 macOS 图标不是随便一张方图很多人从 Windows 或者移动端转过来做 macOS 图标第一反应是不就是个圆角矩形吗然后随手画个圆角就交差。但 macOS 的图标规范里圆角半径、留白比例、投影方向都是有讲究的。系统自带的那些应用图标你仔细看会发现它们并不是把内容铺满整个画布而是留了一圈透明的呼吸空间这样在 Dock 栏里排列的时候图标之间才不会挤在一起显得很闷。具体来说macOS 应用图标的标准画布是 1024×1024 像素但实际图形内容通常只占中间大约 824×824 的区域四周各留约 100 像素的透明边距。这个比例不是拍脑袋定的是苹果为了让图标在视觉上和系统图标保持一致的重量感。如果你把图形画满整个 1024 画布放进 Dock 里会明显比旁边的系统图标大一圈看起来特别突兀。圆角方面macOS 的图标圆角半径大约是画布宽度的 22.37%换算到 1024 画布上大概是 229 像素左右。这个数字记不住也没关系你在设计工具里画一个 824×824 的圆角矩形圆角半径设成 185 像素左右视觉上就非常接近系统图标了。我一般会直接拿系统图标的形状做参考把它的轮廓描下来当模板这样最省事也最准。2.2 尺寸矩阵一套图标到底要切多少张这是新手最容易漏掉的部分。macOS 的.icns文件内部其实是一个容器里面装着多个不同尺寸的 PNG系统会根据显示场景自动挑最合适的那一张。如果你只塞一张大图系统在需要小尺寸时就得实时缩放效果差还费性能。标准的 iconset 需要下面这些尺寸注意每个尺寸还分 1x 和 2x 两档2x 是给 Retina 屏用的逻辑尺寸实际像素1x实际像素2x典型使用场景16pt16×1632×32菜单栏、列表小图标32pt32×3264×64Finder 列表视图128pt128×128256×256Finder 图标视图256pt256×256512×512访达大图标、预览512pt512×5121024×1024Dock、启动台、App Store加起来一共 10 张 PNG。命名也有固定格式必须是icon_16x16.png、icon_16x162x.png这种2x后缀表示 Retina 版本。iconutil这个工具就是靠文件名来识别尺寸的名字写错了它直接报错或者打包出来的 icns 缺档。提示16×16 和 32×32 这种超小尺寸直接拿大图缩会糊成一团。我的做法是在设计工具里针对小尺寸单独微调把细节简化、线条加粗保证缩到 16 像素还能看出是什么。这一步偷懒的话最终在 Finder 列表里就是一团色块。2.3 设计阶段的几个实操心得第一母版图一定要用 1024×1024 的 PNG背景透明不要用 JPGJPG 不支持透明通道圆角外面会变成白底。第二导出的时候用 sRGB 色彩空间避免在某些显示器上偏色。第三如果你用的是矢量工具比如 Sketch、Figma、Illustrator记得导出时勾选导出为 PNG并确认尺寸是精确的 1024别让工具自动加了什么边距。我个人的习惯是先在 Figma 里画好 1024 的母版然后一次性导出所有需要的尺寸。Figma 的导出功能可以配置多个倍率但它的命名规则和iconutil要求的不一样所以我一般只导出 1024 这一张剩下的交给sips批量缩放这样命名可控不容易出错。3. 用 sips 和 iconutil 把母版图变成标准 icns3.1 sips 是什么为什么用它来缩放sips是 macOS 自带的图像处理命令行工具全称 Scriptable Image Processing System。它的好处是不依赖任何第三方库系统装好就有而且缩放质量相当不错。相比用 Photoshop 一张张手动导出sips一条命令就能把 1024 的图缩成任意尺寸还能保持透明通道。先确认一下你的母版图准备好了假设叫appicon.png放在桌面。打开终端先cd到图片所在目录cd ~/Desktop然后建一个专门放 iconset 的文件夹名字必须以.iconset结尾这是iconutil的硬性要求mkdir appicon.iconset接下来就是批量生成各个尺寸。我习惯写一个循环但为了让你看清楚每一步在干什么先手动演示几条sips -z 16 16 appicon.png --out appicon.iconset/icon_16x16.png sips -z 32 32 appicon.png --out appicon.iconset/icon_16x162x.png sips -z 32 32 appicon.png --out appicon.iconset/icon_32x32.png sips -z 64 64 appicon.png --out appicon.iconset/icon_32x322x.png这里的-z参数后面跟的是高度和宽度sips -z 16 16就是把图缩成 16×16。注意顺序是先高后宽虽然正方形图无所谓但养成习惯不容易错。--out指定输出路径和文件名。把剩下几档也补上sips -z 128 128 appicon.png --out appicon.iconset/icon_128x128.png sips -z 256 256 appicon.png --out appicon.iconset/icon_128x1282x.png sips -z 256 256 appicon.png --out appicon.iconset/icon_256x256.png sips -z 512 512 appicon.png --out appicon.iconset/icon_256x2562x.png sips -z 512 512 appicon.png --out appicon.iconset/icon_512x512.png sips -z 1024 1024 appicon.png --out appicon.iconset/icon_512x5122x.png跑完之后ls appicon.iconset看一下应该有 10 个文件命名和上面表格里的一一对应。这一步如果文件名错了后面iconutil会直接告诉你缺哪个倒也不难排查。3.2 iconutil 打包成 icnsiconset 文件夹准备好之后打包就一条命令iconutil -c icns appicon.iconset -o appicon.icns-c icns表示输出格式是 icns-o指定输出文件名。跑完你会在当前目录看到一个appicon.icns这就是最终要接进 Xcode 的文件。想验证一下 icns 里到底装了哪些尺寸可以用iconutil -c iconset appicon.icns -o verify.iconset它会反向解包成一个 iconset 文件夹你ls一下就能看到里面所有尺寸确认没缺档。这个反向操作在排查为什么图标显示不对的时候特别有用。注意iconutil对 iconset 里的文件命名极其严格多一个空格、少一个2x都会失败。如果你是从别处拷来的 iconset先ls检查一遍命名再打包。3.3 一条命令搞定的脚本版本如果你经常要做图标手动敲十条sips太累我一般会存一个 shell 脚本把母版图路径当参数传进去自动切图加打包#!/bin/bash # usage: ./make_icns.sh appicon.png SRC$1 NAME${SRC%.*} ICONSET${NAME}.iconset mkdir -p $ICONSET sips -z 16 16 $SRC --out $ICONSET/icon_16x16.png /dev/null sips -z 32 32 $SRC --out $ICONSET/icon_16x162x.png /dev/null sips -z 32 32 $SRC --out $ICONSET/icon_32x32.png /dev/null sips -z 64 64 $SRC --out $ICONSET/icon_32x322x.png /dev/null sips -z 128 128 $SRC --out $ICONSET/icon_128x128.png /dev/null sips -z 256 256 $SRC --out $ICONSET/icon_128x1282x.png /dev/null sips -z 256 256 $SRC --out $ICONSET/icon_256x256.png /dev/null sips -z 512 512 $SRC --out $ICONSET/icon_256x2562x.png /dev/null sips -z 512 512 $SRC --out $ICONSET/icon_512x512.png /dev/null sips -z 1024 1024 $SRC --out $ICONSET/icon_512x5122x.png /dev/null iconutil -c icns $ICONSET -o ${NAME}.icns echo done: ${NAME}.icns把这段存成make_icns.shchmod x make_icns.sh给它执行权限以后./make_icns.sh 任意图.png就能一键出 icns。 /dev/null是把 sips 的冗余输出丢掉让终端干净点。这个脚本我用了很久稳定得很。4. 把 icns 接进 Xcode 工程4.1 两种接入方式Assets 还是直接放 icnsXcode 里给 macOS 应用配图标有两条路。一条是用 Asset Catalog把图标放进Assets.xcassets里的AppIcon集合另一条是直接在 target 设置里指定一个.icns文件。两种都能用但适用场景不太一样。Asset Catalog 的好处是 Xcode 会帮你管理各个尺寸而且和 iOS 的图标管理方式统一如果你做的是跨平台项目用 Assets 更省心。缺点是它要求你把每个尺寸单独拖进去或者用 Xcode 的导入功能稍微麻烦一点。直接放 icns 的好处是简单粗暴一个文件搞定适合那种不想折腾 Assets 的小工具。我个人的选择是如果是正经上架或者长期维护的 App用 Asset Catalog如果是自己用的小工具、脚本套壳直接放 icns 更快。4.2 用 Asset Catalog 配置图标在 Xcode 里打开你的工程找到Assets.xcassets里面应该有一个AppIcon条目。点进去你会看到一个网格每个格子对应一个尺寸从 16×16 到 512×5122x和前面 iconset 的尺寸一一对应。最省事的做法是把之前生成的appicon.iconset文件夹里的 PNG 直接拖进对应的格子里。Xcode 会自动识别尺寸并放到正确的位置。拖完之后每个格子都有图没有警告就说明配好了。如果你嫌一个个拖麻烦也可以只拖 1024 那张到512x5122x的格子然后让 Xcode 自动生成其他尺寸——但我不推荐这么做因为 Xcode 的自动缩放质量一般小尺寸容易糊。还是老老实实用sips切好再拖效果最稳。配好之后去 target 的 General 页面确认App Icon那一栏选的是AppIcon。然后 Build 一下跑起来看看 Dock 栏里的图标对不对。4.3 直接指定 icns 文件的方式如果你走的是直接放 icns 这条路步骤是这样的把appicon.icns拖进 Xcode 工程的导航栏注意勾选 Copy items if needed确保文件被拷进工程目录。然后在 target 的 Build Settings 里搜索ICON找到Asset Catalog App Icon Set Name或者App Icon相关的设置项。更直接的方式是在Info.plist里加一个键CFBundleIconFile值填你的 icns 文件名不带扩展名比如appicon。这样打包出来的 App 就会用这个 icns 作为图标。注意用 icns 方式的时候文件名大小写要一致。macOS 文件系统默认不区分大小写但打包和某些工具链可能会区分养成全小写的习惯最保险。4.4 打包后验证图标有没有生效Build 完之后去 DerivedData 或者你指定的输出目录找到.app文件右键显示包内容进去看Contents/Resources/里有没有你的 icns 文件。如果有说明打包带上了。然后把这个.app拖到 Applications 文件夹再拖到 Dock 栏上看看图标显示是否正常。如果显示的还是默认的空白图标八成是Info.plist里的键名写错了或者 icns 文件名对不上。这时候可以mdls -name kMDItemFSName -name kMDItemContentType 你的App.app看一下系统识别到的图标信息辅助排查。还有一个常见的坑macOS 有图标缓存有时候你换了图标但系统还显示旧的。这时候可以killall Dock重启一下 Dock或者用touch 你的App.app更新一下文件时间戳强制系统重新读取图标。5. 常见问题与排查技巧实录5.1 图标在 Finder 里糊、在 Dock 里正常这个现象基本可以断定是 iconset 缺了小尺寸。Finder 列表视图用的是 16×16 或 32×32如果你只提供了 512 和 1024系统就得硬缩糊是必然的。解决办法就是回到 iconset 那一步确认 10 个尺寸一个不少。用前面说的iconutil -c iconset反向解包验证一下最直接。5.2 iconutil 报错 Failed to generate ICNS这个报错通常有两个原因。一是 iconset 文件夹里文件名不符合规范比如写成了icon_16.png而不是icon_16x16.png二是文件夹里混进了无关文件比如.DS_Store。macOS 的 Finder 会在你浏览过的文件夹里生成.DS_Store打包前记得删掉rm -f appicon.iconset/.DS_Store养成习惯打包前ls -a看一眼有没有隐藏文件。5.3 图标有白边或者圆角外面是白的这是母版图背景不透明导致的。检查你的 PNG 是不是真的透明背景可以用预览打开按CmdI看信息或者用sips -g hasAlpha appicon.png查一下有没有 alpha 通道。如果显示hasAlpha: no说明你的图没有透明通道得回设计工具重新导出。5.4 Xcode 里图标显示正常但打包后不对这种情况多半是 Asset Catalog 的 target membership 没勾对或者 icns 文件没被正确拷贝进 bundle。检查一下Assets.xcassets或者 icns 文件在 Xcode 右侧的 File Inspector 里Target Membership 有没有勾上你的主 target。另外确认 Build Phases 里的 Copy Bundle Resources 包含了图标资源。5.5 常见问题速查表现象最可能的原因快速排查方法Finder 里图标糊iconset 缺小尺寸反向解包 icns 看尺寸iconutil 报错文件名不规范或有隐藏文件ls -a检查命名和 .DS_Store圆角外有白底母版图无透明通道sips -g hasAlpha检查打包后图标不对target membership 没勾看 File Inspector换了图标不更新系统图标缓存killall Dock或 touch app5.6 几个我踩过的坑第一个坑是母版图尺寸不是精确的 1024。有些设计工具导出时会因为画板设置问题导出成 1023 或者 1025sips缩放的时候就会产生非整数比例边缘出现半透明杂边。导出后一定用sips -g pixelWidth -g pixelHeight appicon.png确认一下是 1024×1024。第二个坑是色彩空间。如果你的母版图是 Adobe RGB 或者 P3缩放到小尺寸后颜色可能和预期有偏差。统一用 sRGB 最稳sips也能转换sips -m /System/Library/ColorSync/Profiles/sRGB Profile.icc appicon.png。第三个坑是图标内容太复杂。小尺寸下细节全丢看起来就是一团。我的经验是图标主体元素不要超过三个线条尽量粗颜色对比要强。16×16 那个尺寸能看出轮廓就算成功别指望它能表现细节。6. 关于图标制作的一些延伸经验整套流程走下来核心其实就是三件事设计阶段守好 1024 画布和透明背景、用sips切齐 10 个尺寸、用iconutil打包成 icns 再接进 Xcode。工具都是系统自带的不需要额外装东西这点对保持开发环境干净很重要。我后来把这套流程固化成了一个 Makefile放在项目根目录make icon就自动从design/appicon.png生成 icns 并放到资源目录。这样每次改了设计稿一条命令就能更新图标不用记那些sips参数。如果你团队里有多个人协作把母版图和脚本一起提交到仓库谁都能一键重新生成避免有人手动导出导致尺寸不一致。另外提一句如果你做的是 Electron 或者 Tauri 这类跨平台桌面应用macOS 端的图标同样走 icns 这套流程只是打包配置里指定的字段名不一样。Electron 是在electron-builder的配置里指定icon路径Tauri 是在tauri.conf.json里配。底层用的还是同一个 icns 文件所以这套制作流程是通用的学一次到处能用。最后分享一个小技巧如果你手头只有一张现成的 App 图标想提取它的 icns可以直接右键显示包内容进Contents/Resources/把里面的 icns 拷出来然后用iconutil -c iconset反向解包就能拿到所有尺寸的 PNG 当参考。这个方法在模仿系统图标风格的时候特别好用比对着截图描准多了。
