Critter Maker 是一个纯前端的随机怪物头像生成与编辑网站。输入或随机获得一个 Seed，网站就会生成一只独特的 SVG 小怪物，相同的 Seed 永远对应同一只怪物。用户可以随机探索、锁定喜欢的部件做局部变异、收藏满意的作品，并导出为 SVG 矢量图或 PNG 图片。
项目无需注册、无需后端，所有收藏和生成历史只保存在当前浏览器中。技术栈为 Vue 3、Vite、TypeScript、Pinia 与分层 SVG 头像引擎。仓库暂未声明开源许可证。
场景痛点
想换一个独特的头像，常规选项都不太顺：用自拍有隐私顾虑，在头像库里挑很难不撞款，找设计师定制要花钱还要等周期。生成式 AI 画头像虽然流行，但结果不可控，同一句话画两次风格就漂移，想微调某个局部更是无从下手。另一个普遍需求是把「随机灵感」和「精确控制」结合起来：先大量看随机结果找感觉，再对接近目标的那个做小幅修改。多数工具要么只给随机，要么只给编辑，两段流程接不上。
核心功能
Seed 确定性生成
相同 Seed 始终生成相同头像，Seed 支持中文、Emoji 等 Unicode 字符。头像可以只靠 URL 中的 Seed 复现，把链接发给别人就能让对方看到同一只怪物；移动端还支持系统原生分享面板。
部件库与自由搭配
10 种差异化身体（方形、圆形、水滴形、云朵形、幽灵形等）、12 种眼睛、10 种嘴巴、12 种配件，身体色、高光色和背景色自由搭配。单个部件支持缩放、旋转、水平翻转，还可以套用头像遮罩裁出圆形轮廓。
部件锁定与局部变异
这是探索式创作的核心流程：随机生成到接近满意的怪物后，锁定喜欢的部件，按一次变异只改动未锁定的部分，逐步把随机结果收敛成想要的样子，不需要从零手调每一个参数。
Critter DNA
每只怪物有一份可查看的 DNA 数据，支持复制与粘贴恢复。把 DNA 存下来，换浏览器或隔一段时间粘贴回去即可还原同一只怪物，相当于给作品留了一份可迁移的备份。
本地收藏与生成历史
满意的怪物可加入收藏，最近 50 条生成历史自动保留，回溯刚才刷过的结果不用重新碰运气。
SVG 与 PNG 导出
支持导出 SVG 矢量图（无限放大不失真），以及 256、512、1024 三档像素的 PNG，可选原始背景或透明背景，直接用于社交平台头像、项目占位图或设计素材。
互动与无障碍适配
怪物有鼠标跟随、悬浮、点击互动和切换动画，桌面端、平板和移动端均为响应式布局。提供键盘快捷键，并做了减少动画的无障碍适配。快捷键如下：
| 按键 | 功能 |
Space | 随机生成新的 Critter |
M | 变异未锁定部件 |
F | 收藏或取消收藏 |
C | 打开或关闭自定义面板 |
D | 打开下载弹窗 |
Esc | 关闭当前弹窗或面板 |
输入 Seed 时快捷键会自动禁用，避免干扰文字输入。
安装与使用
前置条件
- 直接使用：现代浏览器，访问在线地址即可
- 本地开发：Node.js 20 或更高版本，npm 10 或更高版本
使用与本地部署
日常使用无需安装，打开在线地址（见文末）即可开始。想在本地跑源码的话：
开发服务器默认运行在 http://localhost:5173。构建与预览命令如下：
| 命令 | 用途 |
npm run build | 生成生产构建，产物位于 dist/ 目录 |
npm run preview | 本地预览生产构建 |
场景建议
| 场景 | 推荐操作 | 说明 |
| 找社交平台头像 | 随机 + 锁定变异 + PNG 1024 导出 | 透明背景可直接当头像 |
| 网站默认占位头像 | 按用户名作 Seed 生成 | 相同用户名稳定生成同一只怪物 |
| 设计素材收集 | SVG 矢量导出 | 无限缩放，适合进设计软件二次加工 |
| 分享给朋友 | URL Seed 分享或 DNA 复制 | 链接直接复现，DNA 可跨设备还原 |
我的使用感受
从功能编排看，Critter Maker 把「随机探索、局部收敛、稳定复现」这条创作链路做得完整：Seed 确定性保证了结果可追溯，锁定加变异让随机变成可控的灵感来源，DNA 复制粘贴补上了跨设备迁移的缺口。
部件数量（10 身体、12 眼睛、10 嘴巴、12 配件）乘上三组颜色搭配，组合空间足够大。无后端的架构也让隐私账单干净：不上传任何数据，代价是清理浏览器站点数据会连带清空收藏和历史，重度使用者需要用 DNA 或导出文件自行备份。
官方网站
https://github.com/ns2250225/monster-avatar
下载地址
https://pan.quark.cn/s/f69847b3cc34
