关于 suggest-lucide-icons
面向产品设计师和界面开发者的 Lucide 图标建议技能,可根据概念或截图语境筛选图标,并确认名称确实存在。
主要功能
- 01按概念与标签搜索图标
- 02结合截图判断界面语境
- 03验证图标名称并提供近似项
- 04给出三个候选及首选建议
适用场景
- 01为界面中的概念挑选图标
- 02检查手动组合的图标名称
安装
复制下面的命令,在终端中运行。
npx skills add https:/ / github.com/ nweii/ agent-stuff --skill suggest-lucide-icons安装后在 Claude Code 中输入/suggest-lucide-icons确认已加载。
附带文件scripts/lucide.py
详细介绍
推荐 Lucide 图标
从 Lucide 开源图标包中推荐最适合用来象征某个概念或适用于特定 UI 位置的图标。请广泛考量象征关联——涵盖文化、科学和设计,而不只是字面匹配。
输入
提供以下一项或两项:
- 概念:要表达的想法、动作或含义
- 截图:展示需要图标的 UI 上下文
目录脚本
scripts/lucide.py(Python 3,无依赖项)会从 unpkg.com/lucide-static@latest/tags.json 一次性获取完整的 Lucide 图标集,缓存约 24 小时,并在本地搜索和验证,因此无需逐个获取图标:
search "<terms>"— 按名称和语义标签搜索并排序概念相关的真实图标。每个结果都是确实存在的图标,并附有标签,方便了解它为何适用。validate <name>...— 确认指定名称(例如手动组合的名称)。未匹配的名称会显示相近名称建议;只要有任何名称不存在,退出代码就会是非零值。
如果没有 Python 3,可直接获取该 URL(内容格式为 {name: [tags]}),或者通过 https://unpkg.com/lucide-static@latest/icons/<name>.svg 检查单个图标(200 表示存在,404 表示不存在;请跟随 302 重定向)。
命名规则
图标名称遵循严格规则——阅读搜索结果或构建复合候选名称时请遵守:
- kebab-case:使用
arrow-up,而不是Arrow Up - 国际英语:使用
color,而不是colour - 分组变体:
<group>-<variant>— 例如,badge-plus基于badge - 多个元素,尺寸不同:按从大到小的顺序排列 — 如果圆形更大,使用
circle-person - 带修饰符的元素:
[element]-[modifier]— 使用circle-dashed,而不是dashed-circle;组合形式:circle-dashed-heart-broken
流程
-
构思关联 — 梳理关键概念、视觉隐喻和截图中的上下文线索,并将它们整理成少量搜索词。
-
搜索目录 — 从脚本结果中筛选候选项,而不是猜测名称:
python3 scripts/lucide.py search "calendar schedule date"标签会说明每个图标为何适用。如果根据命名规则构建了复合名称,请在推荐前确认它是否存在:
python3 scripts/lucide.py validate circle-dashed-heart-broken -
列出 3 个已确认的候选图标 — 包括图标名称及其适用理由(象征含义、视觉清晰度、上下文适用性)。
-
推荐最佳选项 — 选出一个最合适的方案,并说明理由。
指南
- 仅推荐经
search确认(结果真实存在)或经validate确认(手动构建的名称)的图标——绝不编造名称。 - 如果符合条件的候选图标少于 3 个,请在放弃前尝试更多搜索词。
- 如果经过充分搜索后仍找不到合适的匹配项,请如实说明。
- 对于截图,请根据具体设计上下文调整推荐。
- 每个所需图标都应单独给出推荐。
- 可通过多轮反馈持续完善建议。
输出格式
构思关联:[关键关联和隐喻]
候选图标:
- icon-name — 适用理由
- icon-name — 适用理由
- icon-name — 适用理由
推荐:icon-name — 说明它为何最适合[上下文]