🤖 Relume 是什么?一个从 Webflow 代理商“长出来”的 AI 网站规划工具
Relume 的起点很实在。创始人 Dan Anisse 和 Adam Mura 在悉尼经营一家 Webflow 设计代理商,每天做的事情就是重复搭建导航栏、Hero 区域、定价表格这些“每个网站都需要”的组件。2020 年,他们决定把这些重复劳动产品化,做了一个 Webflow 组件库,设计师可以直接复制粘贴到项目里。2021 年 11 月在 Product Hunt 上线后,Webflow 社区反响很好,到 2023 年 8 月积累了 41,000+ 用户,全程没有拿过一分外部融资。
但真正让 Relume 从“组件库”变成“AI 网站规划工具”的,是 AI 功能的加入。现在你只需要输入一段关于网站的简短描述,比如“一个面向 SaaS CRM 工具的营销网站”,Relume 的 AI 会在几分钟内生成完整的网站地图(sitemap)和线框图(wireframe),并为每个区块填充初步文案。你可以在可视化编辑器里拖拽调整页面顺序、修改区块布局、用 AI 重写文案,然后一键导出到 Figma 或 Webflow 继续做高保真设计和开发。
截至 2026 年,Relume 已经从一个“Webflow 设计师的效率工具”成长为覆盖网站规划、内容架构、线框设计、样式指南生成和直接发布的完整平台。用户超过 100 万设计师和开发者,客户包括各种规模的代理商、自由职业者和初创团队。月度访问量在 58 万到 85 万次之间,跳出率约 37%-45%,用户平均每次访问浏览 4-5 个页面,全球网站排名约第 7.2 万到 9.6 万位。团队规模约 32 人,年收入估计在 180 万到 330 万美元之间,2025 年底 ARR 达到约 330 万美元。
需要说清楚 Relume 的定位边界:它不是一个从头到尾做完整网站的工具,至少目前还不是。它的核心价值在于把网站项目里最耗时、最重复、最不“创意”的那一段——从“客户说了几句话”到“有一份可以给客户看的结构化线框图”——从几天压缩到几分钟。后面的精细设计、品牌定制、开发部署,仍然是 Figma 和 Webflow 的战场。Relume 做的是“把地基打好、把框架搭好”,而不是“把房子装修完”。

⚡ 核心 AI 功能拆解:Relume 的 AI 到底怎么工作
Relume 的 AI 能力可以分成四条线来理解:AI 网站地图生成、AI 线框图与组件选择、AI 文案生成,以及样式指南生成。下面按实际使用顺序来拆。
🗺️ AI 网站地图生成:从一句话描述到完整的页面结构
这是 Relume 工作流的第一步,也是整个工具“把零变成一”的环节。你在 Site Builder 里输入一段网站描述,AI 会分析这段文字,生成一个包含多个页面的网站地图。每个页面有明确的标题和区块划分——比如首页会包含 Hero 区、功能展示区、客户评价区、定价区和页脚,关于页面会包含团队介绍、公司故事和联系方式。
网站地图和线框图是联动的。你在网站地图里删除一个区块,线框图里对应的部分会自动消失;你在网站地图里修改一个区块的标题或描述,这个改动会作为“区块提示词”影响 AI 在线框图中生成的组件类型。这个联动设计让“调整网站结构”变得非常直观——你不需要在多个工具之间同步改动,改一处就够了。
🧩 AI 线框图与组件选择:从 1,000+ 人工组件中智能装配
Relume 的线框图生成逻辑和很多“AI 生成设计”的工具不一样。它的 AI 不直接生成原始代码或像素布局,而是从 Relume 设计师团队手工构建和维护的 1,000 多个响应式组件库中选择合适的组件,把它们装配成你网站的结构。这些组件覆盖了营销网站最常用的模式——导航栏、Hero 区、功能网格、团队展示、客户 Logo 墙、定价表、FAQ、页脚等等,每个组件都有桌面端和移动端的适配版本。
2025 年 9 月推出的 Wireframing 2.0 是这个能力的重大升级。1.0 版本只能从组件库中约 25% 的营销组件里选择,生成的结果被用户吐槽“太模板化、布局重复”。2.0 版本把可用组件比例提升到了约 70%,并加入了更智能的决策逻辑:它会根据页面描述选择“符合品牌调性”的组件风格(比如给代理商网站选非对称布局,给 SaaS 选卡片布局)、根据内容数量选择正确的组件变体(比如“2 个定价方案”会生成双列布局而不是默认的三列)、以及考虑页面纵向的节奏感,避免连续出现重复的区块类型。官方把这次升级描述为“不是改进,而是线框图生成本应该有的起点”。
✍️ AI 文案生成:Copywriting 1.5 的“整页连贯”升级
Relume 的文案生成经历了从 1.0 到 1.5 的明显进化。1.0 版本基于 GPT-3.5 mini,上下文窗口只有约 10,000 个字符,意味着 AI 每次只能看到一个区块的内容,生成出来的文案在不同区块之间是“断裂”的——语气不一致、短语重复、读起来像拼凑的。
Copywriting 1.5 换用了 Anthropic 的 Claude 模型,上下文窗口大幅扩展,AI 现在一次性考虑整个页面来生成文案。结果是不同区块之间的文案有了连贯的语气和叙事线,重复短语明显减少,读起来更像“一个人写的”而不是“多个 AI 片段拼的”。官方把 Copywriting 1.5 定位为“让文案成为 Relume 的强项,而不是需要绕过去的问题”。当然,目前生成的文案仍然是“初稿级”的——够用,但正式发布前建议人工润色。
🎨 样式指南生成:AI 推荐配色和字体,一键换肤
线框图生成之后,你可以进入 Style Guide 标签页,让 AI 为你的项目生成一套视觉概念。Relume 会根据网站描述推荐配色方案、字体组合和基础 UI 设置。如果你不满意,可以点“Surprise Me”按钮让 AI 重新生成一套。你也可以手动调整颜色、字体和间距,调整后的样式会实时应用到所有线框图上,让你在导出之前就看到“有颜色的版本”长什么样。
这个功能的意义在于:它让“线框图”从一个灰度的低保真草稿,变成了一个可以和客户做初步视觉沟通的材料。你不需要在 Figma 里花几个小时调色,在 Relume 里花十分钟就能有一个“看起来像那么回事”的样式预览。
🚀 安装与使用:从注册到导出 Figma 的完整流程
Relume 是一个云端平台,核心操作在浏览器里完成。但它的价值很大程度上依赖于和 Figma、Webflow 的集成,所以除了注册账号之外,你还需要安装几个配套工具。
1. 注册与免费方案
访问 relume.io 注册账号。免费方案包含 1 个项目,但有一个重要的限制需要提前知道:免费方案只能解锁 1 个线框图页面,其余页面可以生成但不能编辑和导出。免费方案可以访问全部组件库的预览,但只能使用其中 30 个组件用于实际项目。如果你只是想看看 AI 生成的结构长什么样,免费方案够用;但如果你有真实项目要做,付费是绕不过去的。
2. 安装 Figma Kit 和 Figma 插件
Relume 的 Figma 集成分两步。首先在 Figma Community 里搜索“Relume Figma Kit”,复制到你的 Figma 账户。这个 Kit 包含 1,000+ 组件,带移动端变体和颜色变量。然后在 Figma 里安装“Relume Plugin”,用你的 Relume 账号登录。插件的作用是把你在 Relume Site Builder 里生成的网站地图和线框图导入 Figma,包括 AI 生成的文案和颜色变量。
3. 安装 Chrome 扩展(Webflow 用户)
如果你用 Webflow 做开发,安装 Relume Chrome 扩展。这个扩展让你在 Webflow Designer 里直接访问 Relume 的 1,000+ 组件库,一键复制粘贴到项目中。Webflow 的集成还支持通过 App Marketplace 里的“Relume Site Builder Import”应用直接导入整个网站地图,不需要手动复制粘贴。
4. 从描述到导出的完整工作流
登录 Relume 后,在 Site Builder 里创建一个新项目,输入你的网站描述。AI 会在几分钟内生成网站地图和线框图。你可以在可视化编辑器里调整页面结构、拖拽区块顺序、替换组件变体、用 AI 重写文案。确认结构没问题后,点击 Export,把网站地图和线框图导入 Figma(通过插件)或 Webflow(通过 Chrome 扩展或 Import App)。
在 Figma 里,你可以把线框图升级为高保真设计——替换占位图片、应用真实品牌字体和颜色、精调组件样式。在 Webflow 里,你可以直接发布到生产环境,或者继续用 Webflow 的交互和 CMS 功能做进一步开发。
使用技巧
- 网站描述要写“具体”而不是“漂亮”。Relume 的 AI 会分析你输入的文字来生成结构。如果你写“一个很酷的网站”,AI 不知道“酷”是什么意思。如果你写“一个面向中小企业的会计 SaaS 工具,核心页面包括首页、功能详情、定价、客户案例和博客”,AI 生成的网站地图会准确得多。描述里包含行业、目标用户、核心页面类型三个要素,生成质量最好。
- 网站地图阶段多花时间,线框图阶段就少折腾。Relume 的网站地图和线框图是联动的,你在网站地图里调整的区块标题和描述会直接影响线框图生成的组件类型。所以在网站地图阶段就把页面结构想清楚——哪些页面需要、每个页面有哪些区块、区块的大致内容是什么——比在线框图里一个个手动替换组件要高效得多。
- 免费方案的“1 个页面”限制是硬性的。如果你在评估 Relume,免费方案可以让你体验 AI 生成网站结构和线框图的过程,但只能看到一个页面的完整线框图。如果你需要评估多页面项目的生成质量,可能需要先上 Starter 或 Pro 方案。
- Figma 插件导入时注意变量同步。Relume Figma 插件会把 AI 生成的颜色变量和文案一起导入 Figma。如果你的 Figma 项目里已经有了自己的变量体系,导入时可能会产生冲突。建议在一个干净的新 Figma 文件里先测试一次导入,确认变量命名和结构符合你的工作流,再应用到正式项目。
- 用 MCP 把 Relume 组件接进 Claude。Relume 在 2026 年推出了 Library MCP,你可以在 Claude 里连接 Relume 的组件库,让 AI 助手直接调用 1,000+ 真实组件来生成网站代码。配置方式是把 MCP 地址(relume-library-mcp.relume.io/mcp)添加到 Claude 的 connector 设置里。如果你习惯用 Claude 做开发辅助,这个集成能让 AI 生成的代码直接使用 Relume 的组件,而不是凭空编造布局。
🌍 全球使用情况与市场数据
Relume 在全球网站设计工具市场里的位置,可以从用户规模、流量数据和产品动态三个维度来看。
用户与收入规模:Relume 的用户超过 100 万设计师和开发者。公司的年收入从 2024 年底的约 180 万美元增长到 2025 年底的约 330 万美元 ARR,全程没有拿过外部融资。团队规模约 32 人,在悉尼运营,用户续约率约 90%,说明用户满意度比较稳定。
流量数据:Relume 官网的月访问量在 58 万到 85 万次之间,跳出率约 37%-45%,用户平均每次访问浏览 4-5 个页面,全球排名约第 7.2 万到 9.6 万位。另一组数据估算的月访问量为 84.4 万次。用户主要来自英语市场,尤其是北美、欧洲和澳大利亚。
产品动态:Relume 在 2026 年的产品节奏比较密集。2026 年 5 月推出了 Claude Design Export 和 Relume Library MCP,把组件库接入了 Claude 的 AI 编辑器。2026 年 6 月,Publish Beta 上线,这是 Relume 向“一站式网站构建”迈出的关键一步——用户可以直接在 Relume 上发布网站,使用 Cloudflare 提供的托管和 SSL,不需要导出到 Webflow。Publish 的定价模型在 Beta 阶段还在测试中,官方在社区里向用户征集反馈来调整免费和付费的边界。这个功能如果跑通,Relume 的定位会从“规划工具”变成“从规划到发布的完整平台”。
一个需要留意的趋势:Relume 的流量在 2025 年下半年有所下降(从 10 月的约 175 万次降到 12 月的约 138 万次),但用户规模仍在增长。这个背离可能说明用户的使用方式在变化——从“频繁访问网站做研究”变成了“在集成环境(Figma、Webflow、Claude)里直接使用”,官网的流量不再是衡量用户活跃度的唯一指标。
💰 收费模式:Freemium 四档套餐,按项目和页面数分层
Relume 采用 Freemium 模式,免费方案可以体验核心功能但限制比较严格,付费方案按“每月”或“每年”计费,核心区分维度是项目数量和每个项目可用的页面数。
| 套餐 | 月付价格 | 年付价格(月均) | 项目数 | 页面数/项目 | 核心限制 |
|---|---|---|---|---|---|
| Free | $0 | $0 | 1 个 | 1 个解锁页面 | 只能使用 30 个组件,其余页面可生成但不可编辑/导出 |
| Starter | $38 | $32 | 1 个 | 5 个 | 完整组件库访问,Figma 和 Webflow 导出 |
| Pro | $58 | $48 | 无限 | 无限 | Starter 全部 + 无限项目和页面 |
| Team | $199 | $99 | 无限 | 无限 | 3 个席位,团队工作空间,适合代理商协作 |
怎么选:如果你只是一个自由职业者,偶尔接一个网站项目,Starter 的 $32/月(年付)够用了——1 个项目、5 个页面、完整组件库。如果你持续有多个客户项目,Pro 的 $48/月(年付)是更合理的选择,因为无限项目和页面意味着你可以同时管理多个客户的工作,不需要在项目之间来回删除。Team 方案($99/月,年付)适合有 2-3 人协作的代理商团队,3 个席位共享无限项目。
付费方式:Relume 支持月付和年付,年付折扣约 15-20%。免费方案不需要信用卡,可以无限期使用,但只有 1 个解锁的线框图页面。如果你只是想评估 Relume 的 AI 生成质量,免费方案跑一个项目就够了。
Publish 的定价:Relume 在 2026 年推出了 Publish 功能,可以直接在 Relume 上托管和发布网站,使用 Cloudflare 的全球 CDN 和 SSL。Publish 的定价模型目前在 Beta 阶段还在测试中,官方在社区里征集用户对“什么该免费、什么该付费”的反馈。如果你对直接用 Relume 发布网站感兴趣,建议关注官方的 Publish 定价公告。
⚠️ 常见问题与避坑指南
Relume 在实际使用中遇到的问题,主要集中在生成质量、工具集成和免费方案限制三个方面。
- 生成的线框图“太模板化”。这是 Relume 早期用户反馈中最集中的批评,也是 Wireframing 2.0 想要解决的问题。2.0 把可用组件比例从 25% 提升到了 70%,布局的多样性和品牌匹配度有了明显改善。但需要客观看待的是,Relume 的线框图仍然是“组件装配”的结果,不是从零生成的独特设计。如果你需要的是“每个客户都不一样”的定制化线框图,Relume 的输出仍然需要你在 Figma 里做二次调整。把它当“高质量的起点”而不是“最终成品”。
- 免费方案只有 1 个解锁页面。这是免费方案最硬的限制。你可以生成完整的网站地图和多页线框图,但只有第一个页面是可编辑和可导出的,其余页面是“只读预览”状态。如果你在评估 Relume 是否适合你的工作流,免费方案可以让你看到 AI 生成的结构质量,但没法完整测试多页面项目的导出和 Figma 集成。
- Relume 的 UI 在 2025 年被反馈“比较慢”。有用户在社区里反映“Relume 的 UI 性能问题”——尤其是 Webflow 库的加载和组件导入的过程。Relume 团队在后续更新中做了一些性能优化,但如果你在加载大型项目或使用网络条件不太好的环境,可能会遇到卡顿。建议在 Chrome 里使用,并保持浏览器更新到最新版本。
- 现有项目的集成是“逆向工程”。Relume 的设计逻辑是“从零开始建一个网站”。如果你想把 Relume 的组件和样式指南用到已有的 Webflow 项目里,过程会比较折腾。有用户反馈,把 Relume 的样式指南合并到旧项目时,变量引用和类名同步会出现问题,需要手动调整。Relume 在社区里提供了一些变通方案,但如果你主要的工作场景是“在现有网站上迭代”,Relume 的效率优势不如“从零建站”那么明显。
- 组件库的颜色变量命名被批评“不够清晰”。有用户反馈 Relume 组件库里的颜色变量命名“非常糟糕”,在项目里使用时会和自己定义的全局颜色变量冲突,需要花时间修正。如果你有自己的设计系统,建议在导入 Relume 组件后,先把颜色变量映射到你自己的命名体系里,再做进一步设计。
- 中文内容支持有限。Relume 的 AI 文案生成和网站描述解析主要针对英文优化。用中文输入网站描述,生成的网站结构和文案质量会有明显下降。如果你的项目主要面向中文用户,建议用英文写描述和生成结构,然后在 Figma 或 Webflow 里把文案替换成中文。Relume 的组件库本身不包含中文文案,所以文案生成的中文支持不是它的核心场景。
📝 编辑手记:谁适合用 Relume?
适合:Webflow 和 Figma 的深度用户,尤其是代理商和自由职业者。Relume 的价值在“从零到一”的阶段最突出——客户说了几句话,你需要在 30 分钟内给出一份结构清晰、有初步文案、可以讨论的网站地图和线框图。以前这件事要在 Figma 里手动搭几个小时,现在 Relume 的 AI 帮你把框架搭好,你把精力花在策略和细节上。如果你的工作流是“Webflow + Figma”,Relume 的导出集成能省掉大量复制粘贴和格式转换的时间。对于需要同时管理多个客户项目的代理商,Pro 方案的无限项目和页面是一个合理的投入。
不太适合:如果你不用 Webflow 或 Figma,Relume 的核心价值——无缝导出到设计开发工具——会打折扣。如果你主要用 Framer,Relume 没有官方的 Framer 集成,你需要手动转换。如果你的项目以中文内容为主,Relume 的 AI 描述解析和文案生成对中文的支持有限,你可能需要接受“英文生成、中文替换”的工作方式。如果你只需要一个简单的落地页,用 Webflow 或 Framer 自带的模板可能比学习 Relume 的工作流更快。另外,如果你对“AI 生成的线框图”有“完全不模板化”的预期,需要调整——Relume 的输出仍然是组件装配,不是从零生成的独特设计。
Relume 在 2026 年的产品方向是清晰的:从“网站规划工具”向“从规划到发布的一站式平台”扩展。Publish 功能的 Beta 上线和 Library MCP 的推出,说明团队在认真地把 Relume 从“Webflow 的辅助工具”变成“独立的网站构建平台”。但它的核心优势仍然在于把网站项目里最耗时、最不“创意”的前期规划环节自动化。对于每天都在面对“客户描述很模糊、需要快速出结构”的代理商和自由职业者来说,Relume 是一个能真正省时间的工具。如果你正好在 Webflow 或 Figma 的工作流里,值得从免费方案开始跑一个项目,看看 AI 生成的网站结构和你手动搭的差距在哪里,再做决定。

评论