Diffui — diffusion UI mockups in parallel, then hand off to a coding agent
一句话出好几版网页界面，挑中了再丢给助手写代码。 Generate several UI directions at once, pick one, hand the build plan to your agent.
Diffui 是前 Figma 工程师做的扩散式界面设计工具。官网写：用提示词一次生成多张界面方向（自称约 50 秒出 9 张），还能上传现有截图学品牌色、字体和组件，再往同风格扩页。做完可抽成设计 token，并转成不绑框架的 Web Components；也可把构建说明交给 Codex / Cursor 一类助手去实现。定价页写个人按张计费（约 17 美分一张图）、无需绑卡试用；设计转代码在 beta 期免费。Show HN（2026-07-21）约 80 分。适合想先快速比视觉方向、再交给编程助手落地的产品与设计同学。 Diffui is a diffusion-based UI design tool from a former Figma engineer. The site says a prompt can return multiple UI directions at once (it claims about nine in ~50 seconds), and you can upload screenshots so new screens follow your brand colors, type, and components. Finished work can become design tokens and framework-free Web Components, or a build brief for agents like Codex / Cursor. Pricing is per image for individuals (about 17¢), no card required to try; design-to-code is free while in beta. The 2026-07-21 Show HN landed around 80 points. Good when you want to compare visual directions fast, then let a coding agent implement.
为什么推荐Why we recommend it 收录理由：AI×设计，和库里的 Flowstep、Claude Design、Figma 助手同一类「先出视觉再交助手」，但引擎是扩散不是对话 LLM。本库没有注册 Diffui，没有出图，没有实测 MCP / Codex 插件或转代码。 Why listed: AI×design in the same family as Flowstep, Claude Design, and the Figma agent—visual first, then agent—but driven by diffusion rather than a chat LLM. This library did not sign up, generate images, or test MCP / Codex plugins or code export.
主源是官网 https://diffui.ai/ ，早间 HTTP 200；多选项生成、截图学品牌、Web Components / agent 交接与按张计价照官网、定价页与 changelog 写。Show HN https://news.ycombinator.com/item?id=48995754 （2026-07-21，约 80 分）作者自述离开 Figma 做扩散式出稿。预览为 Playwright 实拍官网首屏裁 3:2 WebP。Primary source is https://diffui.ai/, HTTP 200 this morning; multi-option generation, screenshot brand learning, Web Components / agent handoff, and per-image pricing follow the site, pricing page, and changelog. Show HN https://news.ycombinator.com/item?id=48995754 (2026-07-21, ~80 points) is the founder’s own post after leaving Figma. Preview is a Playwright capture of the homepage above the fold, cropped to 3:2 WebP.
生成按张计费；往正式仓库或设计系统落地前自己先看一眼稿和导出代码。 Generations are billed per image; review mockups and exported code before landing them in a production repo or design system.
先在可撤回、不外发的范围内试跑。本条未批准前：生成按张计费；往正式仓库或设计系统落地前自己先看一眼稿和导出代码。。 Try it first in a reversible, non-outbound scope. Until approved: Generations are billed per image; review mockups and exported code before landing them in a production repo or design system..
把跑通的步骤存成 Skill，下次同类任务直接复用，而不是重新口述。 Save the working steps as a Skill so the next similar job reuses them instead of being re-explained.
确认输出可靠后，再考虑定时或事件触发；例行默认仍应停在待审。 After output is reliable, consider a schedule or event trigger. Routines should still stop at review by default.
