精选 · 开放 · 免费

Relume

Relume是一款AI驱动的设计与开发工具，旨在更快地构建营销网站。

designtool
Relume 网站截图
↓ 下载设计系统包 (17 MB)在 OpenDesign 中打开

原站: https://www.relume.io

📦 浏览包内文件 →

01

设计气质 DNA

AI驱动设计加速营销网站开发者工具

一个融合AI生成与人工策划的网页设计创意副驾。

02

色彩

#6248FFAccent
#161616Ink
#686868Ink soft
#F1F0EEBG
#FFFFFFBG soft
#E4E2DFBG quiet
rgba(22,22,22,0.1)Line

中性、温暖的灰色基底提供干净画布，让鲜明的紫色强调和深色文字引导视觉焦点。

03

字体

humanist-sans · monospace

大型展示标题使用紧凑的字间距。 · 所有正文内容使用标准400字重。

04

间距

4px
8px
12px
16px
24px
32px
48px
64px
96px

以4px的固定倍数创建一致、可预测的版面节奏。

05

表面 (圆角 / 阴影 / 边线)

sm · 6px
md · 8px
lg · 16px
pill · 999px

1px solid rgba(22,22,22,0.1)

rgba(0, 0, 0, 0.04) 0px 1px 2px 0px · rgba(0, 0, 0, 0.08) 0px 1px 3px 0px · rgba(0, 0, 0, 0.08) 0px 8px 10px -4px

06

布局

1280container
12columns
24pxgutter
768 / 1024breakpoints

居中单栏布局，主视觉区包含充裕留白和漂浮的UI元素。

07

动效与交互

220msmicro
400mssmall
800msmedium
cubic-bezier(0.25, 0.46, 0.45, 0.94)easing

hover时平滑的透明度与变换过渡。 · 装饰性UI元素的浮动动画。 · 视口进入时加速的版面变化。

卡片和按钮在hover时产生微妙的背景色变化和轻微的垂直位移。 · 通过背景变化或缩放变换提供即时的视觉反馈。

08

组件

09

文案语气与禁用清单

10

包内真实截图

Relume — 桌面首屏（hero）
桌面首屏（hero）
Relume — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Relume — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Relume — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Relume — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Relume — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Relume — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Relume — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Relume — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Relume — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Relume — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Relume — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Relume — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Relume — 移动首屏
移动首屏

抓自真实页面 · 真 computed styles

11

System Prompt

Relume是一款用于营销网站的高端AI设计工具，定位为快速、协作的副驾，而非人类设计师的替代品。设计采用温暖的灰白色背景（#F1F0EE），深炭灰色文字（#161616），以及标志性的紫色强调色（#6248FF）。字体排印围绕干净的人文主义无衬线类别构建，用于展示和正文。关键设计规则：不使用纯白色背景，避免为标题使用衬线字体，并保持充裕的留白以维持界面高端、整洁的观感。

把这份品味接进你的 Agent

把这套设计的机器可读规格——色彩、字体、动效，整套 DNA——直接交给你的 AI Agent。

OpenDesign 技能 ↗ · 本站 Agent 包 ↗

en · zh-CN · zh-TW · ja · ko