YoYoPixel 适合一种很具体的工作：你已经能使用 Claude Code 之类的文本编程 Agent，希望只用文字快速做一枚像素图、角色原型或地图素材，并且希望结果能在浏览器里立即查看。它不是传统绘图软件，也不调用 GPU 图像模型；项目把绘图规则做成 Claude Code Skill，让文本模型生成独立 HTML/CSS/JavaScript 画布。优点是启动快、容易继续改代码、适合原型和网页展示；需要注意的是，它默认产物是 HTML，不是可以直接拖进 Godot 或 Unity 的 PNG。先看YoYoPixel 官方仓库与下面的项目示例。
安装 Skill：把像素画能力放进 Claude Code 项目
先安装 Claude Code，并打开你准备放置作品的项目目录。在终端克隆 YoYoPixel 仓库，再把 .claude/skills/pixelart 复制到目标项目自己的 .claude/skills/ 目录中。项目级安装的好处是规则跟着这个项目走，其他项目不会自动混入这套说明。仓库提供的是 Skill 文件和示例，不是一个需要双击安装的独立绘图应用。
git clone https://github.com/SbName/yoyopixel.git
New-Item -ItemType Directory -Force .\.claude\skills | Out-Null
Copy-Item -Recurse .\yoyopixel\.claude\skills\pixelart .\.claude\skills\上面后两行适用于 PowerShell；如果使用 macOS/Linux 终端，按 README 用 cp -r 复制。也可以按官方指南做用户级全局安装，让其他项目也能调用。开始前可先浏览YoYoPixel 在线作品展示，理解它输出的 HTML 像素画是什么样子。
第一次生成：尺寸与提示词怎么写
进入 Claude Code 后，调用 /pixelart 并描述尺寸、主体和风格。例如：/pixelart 16x16, a red potion with a cork stopper, centered, dark outline, transparent background。如果是中文描述，也可以把尺寸和关键约束明确列出来：“24×24，橘色小狐狸头像，正面，深棕描边，最多 8 种颜色，居中，背景透明”。提示词越具体，输出越可控；像“画个好看的角色”通常会留下太多自由发挥空间。
官方文档给出的尺寸经验可以这样理解：8×8 适合简单符号；12–16 像素适合小图标和极简角色；24–32 像素可以表现更清楚的人物；48–96 像素适合程序化纹理；96–256 像素可以尝试小型景观。尺寸变大不必然更精致，而是允许更多结构和纹理；如果主题复杂，先拆成主体与背景，不要把每个细节挤进一张小图。
做一个角色、图标或主题素材组
小图标：描述主体、视角、颜色上限、轮廓和留白，例如“16×16 蓝色水晶，正视，亮面在左上，深蓝外框，透明背景”。生成后检查轮廓有没有断开、主体是否占满画布。角色原型：使用 24×24 或 32×32，说明正面/侧面、姿势、主色和一个标志特征，例如“32×32，戴黄色围巾的探险家，侧面站立，背包轮廓清楚”。想做跑步动画时，建议逐帧明确身体倾斜、腿部位置和手臂摆动，再让 Agent 输出多帧变化，而不要仅写“做一个动画”。纹理和场景：尺寸较大时，可以写“夜色下的石砖地面，蓝灰色基调，少量苔藓，每块砖有相同光照方向”。
项目支持用 tileset, 引导生成一组关联素材。例如 /pixelart tileset, medieval village 会面向村庄主题组织一批相关图块；官方示例展示了几十种村庄资产。产出后应逐块检查边缘、色板和比例，把可平铺地面、墙体、装饰物分层，而不是把整张展示图当成一个游戏图块直接导入。
它如何画，以及如何继续修改
YoYoPixel 的核心是根据尺寸与提示选择绘制策略，再把像素格和调色板写进自包含 HTML。小尺寸优先表达剪影；较大尺寸才有余地加入程序化纹理；提示词里出现夜晚、火焰等主题词时，也可能生成星点或火花等视觉效果。你可以让 Claude Code 查看生成文件并继续修改，比如“保持轮廓不变，把主色改成青绿，减少阴影阶数”“让四个村庄地面图块使用相同的边缘纹理”。每次修改最好指出要保留的部分，防止它为了改一个细节重画整张图。
HTML 怎么预览，怎样接到游戏项目
Skill 生成的是独立 HTML 文件，可在浏览器打开查看，也适合放到网页、作品集或交互原型中。它不是标准 PNG 导出器；如果目标引擎只收 PNG 精灵图，需要在浏览器中确认最终像素格后，使用项目自带转换器/导出方式（若当前版本提供）或自行从 HTML 画布捕获，并检查透明通道、像素边界和实际尺寸。不要直接把浏览器截图当作无损游戏素材：页面缩放、设备像素比和抗锯齿都可能改变像素。
建议把输出文件以 100% 原始尺寸检查一遍，再以整数倍放大预览；验证背景是否透明、每个像素边缘是否对齐、相邻 tiles 能否无缝连接。若导入 Godot、Unity 或其他引擎，关闭平滑过滤或使用 nearest-neighbor 设置，并通过测试场景观察实际显示。项目也提供转换器和若干静态示例。
适合什么，不适合什么
它适合快速概念验证、网页像素画、图标草图、主题 tileset 初稿，以及已经在 Claude Code 中工作、希望让模型直接改 HTML/CSS/JS 的开发者。它并不替代有完整图层、时间轴和标准精灵图导出的 Aseprite 等专业工具；它也不保证每次生成都符合严格的游戏美术规范。把它当作“可迭代的文本绘图原型”，再通过人工检查和导出流程把结果变成可交付资产，会更符合它的实际定位。
YoYoPixel 仓库标注 MIT License。将其用在商业项目之前仍应阅读仓库里的许可证文本，并为作品保留清晰的源文件和版本记录。安装步骤见官方 README。