图片裁剪与合成

SKILL前端设计
前端设计 未标注权限 许可证不明确
安装这个技能

图片裁剪与合成工具。从一张图裁剪指定区域贴到另一张图,支持像素/百分比裁剪框、5 种锚点、等比缩放、红点标记框选,每步自动出预览。触发词:裁剪图片、抠图、去页眉页脚、去水印边距、截图拼接、复制图片局部、框选区域、把这块贴到那张图、crop image、paste image、screenshot merge。

一句话选型结论

按资料字段整理

图片裁剪与合成是前端设计类的 Agent Skill,安装方式未标注,权限级别未标注,许可证不明确,有可直接复制的安装命令。技能本质是给模型读的说明书,效果取决于模型与客户端;装完先用一个小任务验证,再放进正式流程。

分类前端设计 安装方式未标注 权限级别未标注权限 许可证许可证不明确
累计安装 未标注 本周 未标注
GitHub 星标 未标注 仓库 未标注
下载量 未标注 技能市场下载数
权限级别 未标注权限 安装前请确认风险范围
许可证 许可证不明确 未说明

安装

未标注
在支持 Skills 的客户端里执行,装完问一句「你有哪些技能」验证
skillhub install user_7d6bebc2/w736583507
  1. 1
    确认客户端支持

    确认你的客户端支持 Skills(Claude、Codex、Cursor 等),并升级到较新的版本。

  2. 2
    拿到技能文件

    执行上面的命令安装;也可以把仓库里的 SKILL.md 手动放进客户端的 skills 目录。

  3. 3
    刷新技能列表

    重新打开客户端,或刷新技能列表,让新放进来的技能被加载。

  4. 4
    验证是否生效

    问一句「你有哪些技能」,确认列表里出现它,再拿一个小任务试跑。

技能档案

前端设计
字段来自技能仓库与公开索引,中文说明由本站标注
作者 / 维护方user_7d6bebc2仓库 未标注 · 版本 未标注
宿主客户端未标注技能可被这些客户端加载
安装方式未标注安装包 community
权限级别未标注权限安装前请确认风险范围
许可证未说明许可证不明确,商用前请自行确认条款
仓库可用性available技能仓库当前是否可访问
最近核验2026-11-06上游最后核验时间 · 数据更新 2026-11-06
正文体量6.4 KBSKILL.md 原文大小,越大说明说明书写得越细

典型使用场景

3 类
按分类整理的常见用法,具体以 SKILL.md 为准
出页面与组件

按描述生成页面结构和组件草稿。

调整样式与布局

改间距、配色与响应式布局。

生成设计说明

把设计稿整理成开发能接的说明。

选择建议

装之前先看这几条
按条目字段给出的判断,不替你决定用不用

值得选的地方

  • 有可直接复制的安装命令,不用自己翻文档找入口。

先想清楚的地方

  • 没有标注权限级别,实际能做什么要装好后确认。
  • 许可证不明确,商用或二次分发前先到仓库确认条款。
  • 没有做站内核验,内容以作者仓库为准。
  • 技能只是说明书,实际效果取决于模型与客户端,装完先用小任务试一遍。

更适合

  • 需要在前端设计场景里给模型补一套做法的人。
  • 愿意先读一遍 SKILL.md、确认它会让模型做什么的人。

不太适合

  • 对许可证要求很严、必须明确可商用的人。
  • 只想装完就自动变强、不打算看说明书的人。

同类对比

6 个同类
同分类里挑最接近的几条,字段以各自详情页为准
技能权限级别安装方式累计安装宿主客户端安装命令
图片裁剪与合成当前 未标注权限 未标注 未标注 未标注 有
前端设计 只读 GitHub 仓库 882.3 万 Codex、Claude、Cursor 有
Vercel 组合模式 联网访问 GitHub 仓库 385.9 万 Codex、Claude、Cursor 有
Vercel React native skills 前端 只读 GitHub 仓库 246.9 万 Codex、Claude、Cursor 有
adapt 搜索 浏览器控制 GitHub 仓库 202.7 万 Codex、Claude、Cursor 有
使用我的浏览器 浏览器控制 GitHub 仓库 184.8 万 Codex、Claude、Cursor 有

SKILL.md 全文

6.4 KB
模型实际读到的说明书原文,来自技能仓库

图片裁剪合成工具

一、触发场景(命中即自动进引导流程)

用户说 走哪个模式
把 A 图某部分贴到 B 图 / 截图拼接 / 局部复制 模式1
裁剪、抠图、去掉页眉水印边距 模式1
框选、可视化选区域、手动画框 模式2

二、硬规则(违反即失败)

  1. 禁止要用户输坐标、百分比或命令,只让他说人话。
  2. 一次只问一个问题,得到答复再进下一步。
  3. 脚本由你拼接执行,不把命令展示给用户。
  4. 🔴 CHECKPOINT:裁剪、粘贴每步必须先出预览图并停下等"可以",禁止连跑两步。
  5. 微调按 10px 或 10% 步进;单轮最多 3 次,第 4 次改让用户在图上标两点(转模式2)。
  6. 🔴 禁止 --output 与 --input/--background 同路径(脚本会拒绝并 exit 2)。

三、模式1:分步迭代(默认)

步 你做什么 产物
1 问源图路径(只有要粘贴时才再问目标图);用 Read 确认文件存在 已存在的绝对路径
2 问裁剪区域("上半部分""左侧30%""去掉顶部页眉"),解析成 --box,跑 crop <源图目录>/.preview_crop_1.png
3 展示预览 → 问"可以吗";微调则重算 box,预览序号 +1 更新后的预览
4 问粘贴位置("右下角""正中间""留20像素"),跑 paste;前景大于底图时先加 --resize-width <目标图目录>/.preview_paste_1.png
5 展示预览 → 确认后存正式文件,告知绝对路径 最终成品

> 只要裁剪、不要粘贴(去页眉、去水印边距、抠图):做完第 3 步就结束,跳过第 4-5 步,直接存正式文件,别问"要贴到哪张图"。
> 收尾时删除本轮生成的 .preview_* 临时文件;用户要求保留则明确告知其所在目录。

四、模式2:红点标记框选

  1. 给指引:用系统「画图」打开源图 → 纯红 #FF0000 画笔 → 在区域左上角和右下角各画一个点(直径 ≥5px)→ 存图上传。
  2. 跑 detect 拿坐标 → 用该 box 跑 crop 出预览 → 🔴 停下确认。
  3. 粘贴位置仍用方位描述,或对目标图重复一次红点标记。

五、命令(自行拼接,勿展示)

> 路径以本技能目录为基准,勿用当前工作目录的相对路径。
> 需 Python 3 + Pillow(python -m pip install Pillow,缺库时脚本会中文提示并退出 2);macOS/Linux 用 python3。

python <技能目录>/scripts/image_editor.py crop --input 源图 --output 预览 --box "左,上,右,下" --unit pixel|percent
python <技能目录>/scripts/image_editor.py paste --background 底图 --foreground 前景 --output 输出 --anchor top-left|top-right|bottom-left|bottom-right|center --position "x,y" --resize-width 宽度
python <技能目录>/scripts/dot_detector.py --input 已标记图

detect 成功时 stdout 只输出 left,top,right,bottom,警告走 stderr;退出码 0 成功 / 1 未识别到合格两点 / 2 参数或文件错误。detect 另可调 --r-min / --gb-max / --dom / --min-area,默认值见 §八。

六、失败模式(每步失败后先查此表)

症状(stderr / 退出码) 一线修复 仍失败兜底
exit 2「源图片不存在」 让用户重发,或核对路径拼写 用 Read 打印实际目录列表让用户指认
exit 2「裁剪框超出图片范围」 按报错里的合法范围重算 box 报图片真实尺寸,请用户重新描述区域
exit 2「裁剪框无效:右必须>左」 方向搞反了,按左上原点重算 无条件改成"全图裁一半"再微调
exit 2「resize-width 超出容纳上限」 用报错给出的最大可用宽度 去掉 --resize-width 按原尺寸贴
exit 2「粘贴位置越界」 减小 --position 或换 --anchor 前景比底图大:按报错给出的「最大可用宽度」加 --resize-width 再贴
exit 2「不是可识别的图片」 请用户另存为 png/jpg 用系统截图重截一张
exit 1「未识别到纯红色标记」 提示换纯红 #FF0000、加粗画笔 放弃红点,转模式1 用语言描述
exit 1「只识别到 1 个合格红点」 按报错里每个红块给出的判废原因改(面积超限/长宽比不像圆点) 转模式1
exit 1「红色像素过多」 只截取目标区域再标记 转模式1 用语言描述
exit 2「输出文件扩展名不支持」 换 .png(保透明)或 .jpg(自动拍平透明通道) 用 <原名>_out.png 重出
WARN「识别到 N 个红块」 图里有其他红色元素,提示去掉后重传 警告不等于失败:先用当前坐标出预览让用户判断
预览图打开是空白/全黑 检查 box 是否退化为 1px 宽 回到第 2 步重新取区域

七、反例黑名单(不要做)

  • ❌ 拿 --output 覆盖原图"省一步"——会毁掉用户素材。
  • ❌ 用户没确认裁剪效果就直接贴图(违反 CHECKPOINT)。
  • ❌ 把命令行贴给用户让他自己跑。
  • ❌ 红点模式里"目测"坐标并宣称识别成功——必须真跑 detect 看 stdout。
  • ❌ 一次抛出多个问题("图在哪、要裁哪、贴哪")。
  • ❌ 把 stderr 的 WARN 当报错重做整个流程。

八、判定阈值与退出码

参数 默认 含义
--r-min 200 红通道下限
--gb-max 80 绿/蓝通道上限
--dom 100 红色主导度 r-max(g,b),滤掉暗红/棕红
--min-area 9 单个红点最小像素数;上限为图面积的 8%

两点中心距 <10px 判为重合、直接失败。识别到多于 2 块时按"最左上 + 最右下"取值并在 stderr 警告;红色像素总数 >20 万判定为整图偏红、直接拒绝。

常见问题

5 问
答案由本站依据条目字段整理
图片裁剪与合成怎么安装?

在支持 Skills 的客户端里执行:skillhub install user_7d6bebc2/w736583507。安装方式为未标注。装完刷新技能列表或重开客户端。

图片裁剪与合成支持哪些客户端?

资料没有标注宿主客户端,但只要客户端支持 Skills(Claude、Codex、Cursor 等),一般都能加载。

图片裁剪与合成权限高吗,安全吗?

权限级别为未标注权限。安装前先看它会读取或写入哪些内容。

图片裁剪与合成收费吗?

本站不代收费用,也没有标注具体价格。是否收费取决于技能本身和所用的模型或客户端,正式使用前按作者说明确认。

图片裁剪与合成用什么许可证?

许可证标注为 未说明(许可证不明确)。商用或二次分发前请到仓库确认条款原文。

热门专题

按场景挑技能
全部专题 →

技能内容以作者仓库为准;分类、权限级别与许可证状态的中文说明为中文整理,最近核验 2026-11-06。