Design & media

零依赖图标生成器

Try it

在完全不装任何三方库(无 Pillow / cairosvg / ImageMagick)的前提下,用标准库 zlib+struct 手写 PNG 编码器生成应用图标:圆角方形渐变底 + 白色实心剪影符号。当用户要"给工具/技能/应用生成图标""换个 icon""没有 Pillow 怎么画图""批量生成 favicon / 应用图标""icon 生成器"时使用。内置 10 个矢量符号(浏览器/云/盾牌/文件夹/对勾/下载/箭头/齿轮/放大镜/锁)+ 5x7 点阵文字,支持任意尺寸与超采样抗锯齿。

What it does

需要给一个工具、技能或应用配图标,但: 装不上 Pillow( 超时 / SIGTERM / 无网络 / 代理问题) 目标是「打开即用」的交付物,不该引入二进制依赖 只想画个**几何符号图标**,不需要照片级图形

The skill document

零依赖图标生成器

这个技能解决什么

需要给一个工具、技能或应用配图标,但:

  • 装不上 Pillow(pip install 超时 / SIGTERM / 无网络 / 代理问题)
  • 目标是「打开即用」的交付物,不该引入二进制依赖
  • 只想画个几何符号图标,不需要照片级图形

→ 用标准库手写 PNG。一个 256×256 RGBA 图标只要约 4KB,生成耗时 < 1 秒。

快速开始

PY="C:/Users/DELL/.workbuddy/binaries/python/versions/3.13.12/python.exe"
S="$HOME/.workbuddy/skills/zero-dep-icon-gen/scripts/gen_icons.py"

# 看有哪些符号
$PY "$S" --list-symbols

# 生成单个
$PY "$S" --spec "my-tool:#4F46E5,#818CF8,browser" -o out/

# 批量(推荐:写 specs 文件,可版本控制)
$PY "$S" --specs-file specs.txt -o out/

# 512 尺寸 + 圆角 96
$PY "$S" --spec "my-tool:#059669,#34D399,check" --size 512 --radius 96 -o out/

# 点阵文字图标
$PY "$S" --spec "wb:#1E293B,#64748B,text|text=WB" -o out/

spec 格式:slug:#主色,#次色,符号[|key=value,key=value]

选项说明
text=symbol=text 时渲染的文字(大写字母/数字,1~4 个)
rotate=符号旋转角度(度),如 rotate=15
shadow=1 时底色压暗 12%,做弱化/次要变体

specs 文件每行一条,# 开头为注释。

可用符号

符号语义视觉
browser网页 / 浏览器 / 控制台实心窗口 + 挖空屏幕 + 三圆点 + 内容线
cloud上传 / 部署 / 云端三圆并集云 + 向上箭头
shield证书 / 安全 / 续期实心盾牌 + 挖空对勾
folder归档 / 整理 / 文件文件夹剪影 + 三条镂空横线
check完成 / 签到 / 通过圆环 + 实心对勾
download下载 / 导出下箭头 + 底部托线
arrow-up发布 / 升级上箭头
gear配置 / 自动化8 齿齿轮 + 中心镂空
search搜索 / 检索放大镜
lock授权 / 密钥锁体 + 锁梁
text缩写文字5×7 点阵(配 --text)

三条设计铁律(踩过坑,别推翻)

1. 符号用实心剪影,不要空心描边

第一版想做「空心描边框 + 内挖空」,结果内挖空把符号本身吃掉了:浏览器成了光板方块、 盾牌里对勾消失、文件夹横线被吞、云朵箭头畸形。

实心剪影两个好处:32px 缩略图下辨识度更高;实现上只需一层 if 在形状内: return True, 不用处理「边框+内洞」的布尔运算。

2. 判定顺序:先外框 → 再挖空 → 最后挖细节

以 sym_browser 为例,顺序错了细节会被覆盖:

1. 不在窗口外框内      -> False
2. 在屏幕区(挖空)    -> 屏幕内容线 True,其余 False   ← 提前 return
3. 在标题栏且碰到圆点  -> False                        ← 最后挖
4. 其余                -> True

第 2 步必须提前 return,否则第 3、4 步的 True 会把屏幕重新填实。

3. 边缘抗锯齿用「超采样 + shape_a 归一」

sym_a = (cov_sym / total) / max(shape_a, 1e-6)

必须除以 shape_a。否则在圆角边缘,像素的符号覆盖本身就是被形状裁剪过的, 再乘一次形状 alpha 会二次衰减,符号边缘出现一圈深色描边。

技术实现要点

PNG 编码(write_png)

只需 3 个 chunk,全部标准库:

png  = b"\x89PNG\r\n\x1a\n"
png += chunk(b"IHDR", struct.pack(">IIBBBBB", w, h, 8, 6, 0, 0, 0))  # 6 = RGBA
png += chunk(b"IDAT", zlib.compress(raw, 9))   # raw = 每行前加一个 \x00 (filter None)
png += chunk(b"IEND", b"")

def chunk(tag, data):
    return (struct.pack(">I", len(data)) + tag + data
            + struct.pack(">I", zlib.crc32(tag + data) & 0xFFFFFFFF))

坑:zlib.crc32 在旧版本返回有符号 int,& 0xFFFFFFFF 保证一致; IHDR 的 CRC 必须覆盖 b"IHDR" + data,漏掉 tag 会导致图片打不开。

几何工具函数

  • seg_dist(px,py,ax,ay,bx,by) — 点到线段距离,用于对勾 / 箭头杆 / 任意角度笔画
  • bar_dist(px,py,x0,x1,y0,y1) — 轴对齐矩形距离,<=0 在内部,用于窗口 / 文件夹 / 横线
  • rounded_square_alpha(...) — 圆角方形覆盖度

尺寸与体积参考

尺寸典型体积
1281.5~2 KB
2563.5~6 KB
51210~18 KB

超采样倍数 SS = 2(2×2)。改 4×4 渲染时间 ×4,肉眼几乎无差别,不建议。

常见错误排查

现象原因处置
spec 格式应为 slug:main,accent,symbolspec 只给了一段必须 slug:#a,#b,sym 三段,冒号分隔
WARN: 未知符号符号名拼错--list-symbols 核对
图标中心一片空白挖空区域过大,把符号吃掉了见「铁律 1」,改实心剪影
圆角边缘有深色描边忘了除以 shape_a见「铁律 3」
符号被截断贴边坐标超出 0.2~0.8符号坐标应留在 0.22~0.78,四周留白
文件生成但打不开CRC 或 IHDR 写错确认 CRC 覆盖 tag + data,color type = 6

与图标上传链路的衔接

生成完图标只是第一半。若目标是发布到技能市场,图标还需上传:

  • SkillHub:图标没有独立更新端点,iconUrl 只能随 publish 的 payload 提交。 换图标 = 发一个新版本。先 POST /api/v1/community/skill-icons/upload (multipart 字段名 file)拿到 iconUrl,再放进 payload.iconUrl。 判据:响应里 iconAuditStatus: "pending" 表示收到;null 表示没生效。 完整流程见 skillhub-publish-skill 技能的 references/icon-upload.md。

  • 若平台方是「上传 zip 包」,把生成的 .png 放在技能目录根部 (文件名 = slug),发布脚本的 find_icon() 会自动兜底找到。

资源

  • scripts/gen_icons.py — 生成器主体,含 10 个符号 + 点阵字体 + PNG 编码器。 加新符号只需写一个 sym_xxx(x, y) 函数并注册进 SYMBOLS 字典。
  • references/design-notes.md — 配色方案与从真实截图反推主色的方法。

Related skills

Generate and edit Draw.io, Mermaid, and Excalidraw diagrams from natural language using a structured JSON spec.

by nssa.io1.0k installs47 stars

Stores durable facts in a categorized, plain-markdown vault on disk, alongside your agent's built-in memory.

by Iván559 installs18 stars

Find why your productivity system keeps failing, then apply the smallest fix — capacity math, bottleneck routing, durable local notes.

by Iván855 installs69 stars

Fetch raw ad creative, app, ranking, and revenue data from AdMapix as structured JSON.

by fly0pants4.3k installs296 stars

Join a video meeting as an AI bot with voice, avatar, and screenshare across four operating modes.

by johnpatternai22 installs8 stars

More from oracis

Browse all skills

把本地 Skill 打包并发布到 SkillHub(腾讯 skillhub.cn)与 ClawHub,覆盖预检、发布、状态回读与竞品对标全链路,并在上传被拒时用二分/ddmin 脚本把「服务端 WAF 拦内容(566)」与「包结构/字段问题」精确区分开。当用户说「发布技能到市场」「上架 skill」「SkillHub 提交失败」「Failed to fetch」「566」「上传 zip 报错」「技能审核状态」「版本号被拒」时使用。也讲清「入库成功 ≠ 已公开」——用 `mine` 的 `reviewStatus`、重发探测 `409 VERSION_EXISTS`、`/versions/<v>/signature` 三个探针判断版本到底走到哪一步。

by oracis1 installs1 stars

平台只有网页后台、没有上传 API 时,用本机已装的 Chrome/Edge + CDP 自动化走完上传/发布/填表流程——复用真实登录态、零安装(不下载 500MB Chromium)、能给文件选择框塞文件;并实测富文本编辑器(公众号 / CMS / 邮件模板)里到底哪些 CSS 能活下来,以及在决定是否接入平台自带的「一键排版 / AI 美化」前先抓它输出做结构化 diff。当用户说「只能网页上传」「后台发布」「网页填表自动提交」「发布到技能市场/各平台控制台」「复用已登录的浏览器」「公众号排版样式不生效/保存后样式没了」「一键排版要不要用」「点了按钮没反应/提交没成功也没报错」时使用。

by oracis2 installs

一键安装并实测验证已验证可用的免费 LLM 到 WorkBuddy/Claude Code,无需注册、无需 API Key。当用户说「装免费模型」「加免费模型」「免费 LLM」「免费模型一键装」「验证免费模型可用吗」「免费模型怎么接入」「帮我配几个免费模型」「监控免费模型」「免费模型挂了吗」「kilo 网关」「kilo-auto」「nemotron 免费」「space-bunny」「智谱 glm 免费」「zhipu 免费」「glm-4-flash」「glm-4.7-flash」「glm-z1-flash」「glm-4v-flash」「探测国外免费模型」「国外平台免费 llm」「优先用免费模型」「读图桥接」「vision bridge」「给 glm-4-flash 加读图」「不读图的模型怎么看图」「阶跃星辰」「stepfun」「step 5」「step-5-preview」「限时免费模型」「ccproxy 读图转发」「给 claude code 加读图」时使用。也用于验证已有免费模型配置是否真的可用(tool calling 是否支持、是否限流、是否支持读图),以及定期 watch 监控免费模型是否下线/限流/失去工具调用能力。

by oracis1 installs

在中国大陆网络环境下用 yt-dlp 下载视频(含 Windows GUI 封装)。当用户要下载 YouTube、Bilibili、SoundCloud 等 yt-dlp 支持的站点内容,或遇到「yt-dlp 装不上 / 下载报 502 / Tunnel connection failed / ffmpeg not found / 缺 JS runtime / TLS fingerprint / watch?v=&list= 把整个列表都下了 / Sign in to confirm you're not a bot / The page needs to be reloaded / 下到一半突然下不动 / 下回来的视频糊、有拖影残影 / 下载速度特别慢」等问题时使用。

by oracis2 installs

聚合搜索百度网盘/夸克网盘/阿里云盘等网盘分享链接。当用户想按作者名、课程名、剧名、书名、软件名找网盘下载路径,或提到「网盘搜索」「PanSou」「盘搜」「找到下载链接」「夸克/百度/阿里网盘资源」时使用。包含已验证的 PanSou 协议端点、绕过系统代理的必要写法、以及可直接运行的本地 Web 应用 panradar.py。

by oracis2 installs

在 WorkBuddy(Windows)环境里交付零依赖本地 Web 应用,并绕开官方测试技能完全不覆盖的本机专属坑。当用户要在本机跑起来一个本地 Web 应用 / 单文件工具 / 案例库 / 看板 / 小工具,或要验证刚写完的 HTML/JS/Python 交付物真的能工作时使用。独家覆盖:Bash 缺 coreutils、bash 是 WSL 启动桩、rm 是坏 shim、PowerShell 不回显 stdout、cwd 漂移、预览面板靠 HEAD 探活——这些在干净 Linux 环境里遇不到。

by oracis1 installs