
动笔前会先检索设计库,而不是直接套一套通用卡片。界面风格覆盖玻璃拟态、新拟态、极简、粗野主义和极光等做法,并注明颜色、动效以及能否落到具体框架。配色方案按软件服务、电商、医疗和金融等产品分开,给出主色、次色、按钮色、背景色和文字色。字体搭配连接到 Google Fonts,并给出 Tailwind 配置和气质说明。图表建议会点名 Chart.js、Recharts 或 D3,同时写下无障碍注意点。落地页结构说明首屏、功能区和按钮怎么摆。质量核对要求使用矢量图标、补上悬停反馈,并检查暗色对比和响应式布局。适合已经在用编码助手、又希望生成界面脱离同一套模板的前端和独立开发者,尤其是要在短时间里交出可运行落地页的时候。
UI/UX Pro Max 是给编码助手用的设计情报库。它把界面风格、配色、字体搭配、图表类型、落地页结构和体验规范做成可检索资料,并按产品类型给出主色、强调色和按钮色。页面列出的宿主包括 Claude Code、Cursor、Windsurf、Antigravity、GitHub Copilot、Kiro、Codex 和 Qoder。从一句界面需求出发,它会先判断产品、风格和行动按钮,再检索资料并生成带字体与配色的界面代码,最后用矢量图标、悬停反馈、暗色对比和响应式做核对。技术栈说明覆盖 React、Next.js、Vue、Svelte、SwiftUI、React Native、Flutter 和 Tailwind。
使用门槛: 需要一定基础
风格与配色检索
按玻璃拟态、极简、粗野主义等风格检索颜色、动效和框架适配,并按产品类型给出主色与按钮色。
字体与图表建议
提供搭配好的字体组合、Google Fonts 与 Tailwind 配置,并为折线、柱状、饼图和热力图书写图表库与无障碍注意点。
落地页结构模板
给出首屏加功能区、视频优先等页面结构,并说明行动按钮放在哪里、配什么颜色。
分技术栈规范
按 React、Next.js、Vue、Svelte、SwiftUI、React Native、Flutter 和 Tailwind 分别写状态、路由、组件和样式的常见做法。
提示到代码流程
先解析产品、风格和按钮意图,再检索资料、生成带配色和字体的代码,并用图标、悬停和响应式做核对。
落地页快速出稿
独立开发者用一句话描述宠物服务或同类产品的气质和预约按钮,让编码助手按检索结果写出可运行的首屏。
给产品换视觉语气
前端在已有 React 或 Vue 项目里选定一套风格和字体,让助手按该技术栈的规范改一版界面,而不是只换几个颜色变量。
补图表与无障碍
做数据展示页时,按图表类型拿到 Chart.js、Recharts 或 D3 的建议,并同时看动画、对比度和加载状态该怎么处理。
它主要给编码助手提供可检索的设计资料,并按检索结果生成界面代码,不是单独的画板。界面风格、配色、字体和落地页结构会先被选中,再写进代码。质量核对关注矢量图标、悬停、暗色对比和响应式,而不是导出一份设计源文件。若你需要的是图层稿,还得另外用设计工具。
官网首页列出的宿主有 Claude Code、Cursor、Windsurf、Antigravity、GitHub Copilot、Kiro、Codex 和 Qoder。技术栈说明覆盖 React、Next.js、Vue、Svelte、SwiftUI、React Native、Flutter 和 Tailwind,规范会跟着你正在写的框架走。这些宿主共用同一套设计情报。安装步骤和是否要登录,正文都没有写明,页面也没有给出一键安装命令,接入前要自己对照宿主的技能目录。
官网把流程写成六步。先读你的提示,判断产品、风格、页面类型和按钮,再去检索风格、字体、配色和体验规则,然后生成带具体颜色和字体的代码。质量核对会看是否用了矢量图标、有没有悬停反馈、暗色对比够不够、布局是否响应式。最后才是可查看的结果。
来自真实用户的评价和反馈