LogoCreator：BYOK 模式的 AI 应用参考实现

LogoCreator 是一个开源 AI logo 生成器（logo-creator.io），Together AI 的示例应用：FLUX.2 pro 生成、FLUX.1 Kontext 改图，Next.js + Radix + Tailwind 的前端，Clerk 与 Upstash 都是可选件。这张卡的主张：它的价值不在功能——功能两天能复刻——而在把「谁来付钱、怎么防滥用、可选依赖怎么降级」这三个 AI 应用特有问题解干净了，且注释把每个决策的为什么写到了参数级。

它解决什么问题

免费 AI 应用的死结：生成图像烧真金白银，开放匿名使用等于把站长 API key 挂在公网上。登录墙又杀转化。LogoCreator 的解法是一个三态矩阵：配置了 Clerk，免费额度（服务端 key）藏在登录后，摩擦挡住匿名循环；用户自带 Together AI key，登录与否都能用，烧的是自己的钱；什么都没配，应用免登录纯 BYOK 跑起来。三个状态共用同一套代码路径，见 generate-logo/route.ts 开头的分支。

怎么解的

五个 API route 各管一件事：生成、改图（Kontext）、品牌套件导入、参考图读取（vision 模型先读用户上传的 logo 再生成）、费用估算。前端一屏：品牌名、风格选择、logo 类型、主色背景、细节档位，加一键预设。历史记录与 SVG 导出在设备端完成，不依赖服务端状态。

设计亮点

免费额度是一次性赠品，不是周期补给。 credits.ts 只有两行常量，注释把经济学说完：1 credit = 1 张图（真正花钱的单位）；额度一次性发，补给窗口「会把站长的 key 变成慢漏水龙头」。客户端文案与服务端账本共用同一份常量，「永远不会漂移」。

prompt 为模型的读法优化，不是为人的写法。 用户选的任意 hex 会被映射成最近的人类颜色名再拼进 prompt——route.ts 里维护一张 24 色表做最近邻，因为模型对 blue (#2F6FF5) 的遵循远好于裸 hex。同样思路在 presets.ts：一键预设只策展 logo 类型、风格种子与背景（保证 gallery 明暗混合），品牌色留给 AI 自动配（每次保持新鲜）——哪些交给模型、哪些人工锁死，边界清晰。

SVG 导出是设备端位图描摹，且预处理比描摹本身重要。 svg-export.ts 用 imagetracerjs 在浏览器里描摹：先做背景压平——FLUX 输出的「白底」布满微噪声，不把容差内像素吸附成单色，描摹会产出上百个碎斑路径；角采样只取不透明角，因为透明角的 RGB 通常是 (0,0,0) 会把参考色拽向纯黑（注释明说 alpha 盲版本正是上一个 bug 的来源）。描摹参数逐个带注释：颜色数、去斑阈值、只出 fill 不出 stroke、blur 抑制 JPEG 抗锯齿边、输出 viewBox 不定宽高让导出真正可缩放。

入参逐字段限长。 zod schema 给每个字符串字段设 max——AI 应用把用户输入直接拼进 prompt，限长是最便宜的第一道墙。

借鉴清单

能搬的：

• BYOK 三态降级：付费 key 服务端托管 / 用户自带 / 纯静态部署，同一套路径覆盖，任何生成类 AI 应用直接套
• 额度经济学：一次性 credit + 登录换免费 + BYOK 不登录，三个旋钮的防滥用组合，credits.ts 的注释值得原文照抄进任何项目的额度设计
• hex→命名色映射再拼 prompt：模型对语言化颜色名的遵循高于十六进制，同类 trick 可推广到尺寸、风格等一切模型不敏感的字段
• 设备端描摹的预处理顺序（先压平背景再描摹）与「注释写为什么」的代码风格
• vision 模型读参考图再生成：把「风格迁移」拆成「先描述后生成」两步，比端到端可控

不适用的：

• 法律上不能抄代码：README 自称 free + OSS，仓库却没有 LICENSE 文件（评估当天 API 与文件树均确认）——无许可即默认版权保留，可借鉴思路，不可复用实现；要 fork 先提 issue 要许可
• Together/FLUX 与 referral 链接是示例应用的商业目的，换供应商时这层要剥掉
• 描摹参数为「平面、少色 logo」特化，照片或渐变重的图不适用
• @vercel/functions 的 ipAddress 等平台耦合，自托管要替换

局限

无许可证是最大硬伤，与自称矛盾，也意味着社区贡献在法律上处于灰色地带。最后推送停在 2026-08（评估当天口径），Future Tasks 仍有未勾项。模型、托管、身份三家绑定，作为「参考实现」读比作为「产品」依赖更合适。

相关

宿主与模型：Together AI（作者 Nutlope 是其 devrel，这也是它作为官方示例存在的原因）、FLUX.2 与 Kontext 编辑模型。