精选 · 开放 · 免费

Caraway

一个面向无毒厨具的现代高端DTC电商网站。

01

设计气质 DNA

一个专注于现代家居生活的高端无毒厨具品牌。

02

色彩

内敛的配色方案，采用大地色、柔和色调，依靠高品质摄影营造视觉冲击力。

03

字体

transitional-serif · humanist-sans

• display56px · 700
• body16px · 400
• small12px · 400

用于醒目的标题使用过渡衬线字体，所有功能性文本使用人文主义无衬线字体。 · 正文保持一致的0.4px字间距以提升可读性。

04

间距

基于4px的网格系统，UI元素之间保持一致的11px和8px间距。

05

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

1px solid #1F3438

rgba(0, 0, 0, 0.05) 0px 4px 5px 2px

06

布局

宽幅、以图像为主导的布局，包含全出血的主视觉区和交替的背景色。

07

动效与交互

按钮和链接在悬停时进行细微的过渡动画。 · 平滑的滚动或页面过渡效果。

交互元素在悬停时进行平滑的颜色或透明度过渡。 · 即时视觉反馈，可能表现为轻微的缩放或颜色变化。

08

组件

• button 高圆角（40px）、药丸形按钮，采用纯色背景或描边样式。
• card 极简风格卡片，主要通过大尺寸、高质量的产品或生活方式摄影来定义。
• chip 小型圆角徽章，用于状态标识（例如：“新品”）。
• input 全宽搜索栏，两端为圆角，并集成搜索图标。
• hero 大型分屏主视觉区，结合粗体衬线字体与生活方式意象。

09

文案语气与禁用清单

• 语气 自信、简洁且注重生活方式，聚焦健康与现代设计。
• 标题风格 大胆且具有宣言性，使用衬线字体传达品质与信任感。
• 按钮文案 以行动为导向且清晰明了，常包含促销细节。

• 避免使用霓虹色或高饱和度的强调色——截图显示的是如#5E6C51和#B3C8E1这类内敛的柔和大地色系。
• 避免在主要按钮上使用尖锐的方形圆角——截图显示的是具有40px border-radius的药丸形按钮。
• 避免在标题中使用激进的全大写文本——截图显示的是大小写混合的衬线标题，仅在小型标签中使用大写。
• 避免在所有地方使用通用的无衬线字体——截图显示用于展示标题的是独特的过渡衬线字体。
• 避免用过多文字挤占界面——截图显示的是布局宽敞，拥有大边距和清晰视觉层次的设计。
• 避免使用深色模式或厚重的背景图案——截图显示的是以浅色模式为主、采用纯色或极其细微渐变背景的简洁设计。
• 避免: 行话
• 避免: 过于技术性的语言
• 避免: 激进的销售策略

10

包内真实截图

抓自真实页面 · 真 computed styles

11

System Prompt

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