精选 · 开放 · 免费

Isla Beauty

一个提供浓缩、高效美容产品的高端护肤品牌，具有极简、现代的美学风格。

01

设计气质 DNA

一个结合了纯净美学与科学功效的奢华护肤品牌。

02

色彩

一套温暖而精致的调色板，以奶油色的灰白和炭灰色为主导，点缀着一个充满活力的、引人注目的红色强调色。

03

字体

transitional-serif · humanist-sans

• display64px · 400

使用 transitional-serif 字体用于醒目、富有表现力的展示标题。 · 使用 humanist-sans 字体用于清晰、易读的正文和导航。 · 保持展示文本紧凑的字间距，以营造精致感。

04

间距

一个一致的 4px 网格提供了结构，而在推广区域则采用宽松的间距，以维持高端、整洁的感觉。

05

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

rgba(0, 0, 0, 0.06) 0px 2px 8px 0px · rgba(0, 0, 0, 0.1) 0px 5px 10px 0px

06

布局

一个干净、居中的布局，配有持久的顶部导航栏和大型、沉浸式的摄影区域。

07

动效与交互

模态覆盖层的平滑淡入过渡。 · 交互元素上微妙的 hover 过渡。 · 用于移动推广横幅的变换效果。

交互元素上微妙的颜色或透明度变化，以提供清晰反馈。 · 即时的视觉响应，通常伴随着向新状态或模态框的过渡。

08

组件

• button 极简按钮，带有微妙的边框或实心填充，通常使用大写文本和胶囊形或略带圆角的形状。
• card 干净的产品展示，依赖于高品质摄影和充足的留白。
• chip 用于过滤或问卷选项的简单文本选择标签。
• input 干净、不引人注目的输入框，边框极少。
• hero 一个全宽、沉浸式的摄影主视觉区域，上方叠加了大型、富有表现力的排版。

09

文案语气与禁用清单

• 语气 自信、极简且注重功效。
• 标题风格 富有表现力且常带对话感，使用衬线与无衬线字体的混合来强调。
• 按钮文案 直接且以行动为导向，按钮中通常使用大写文本。

• 不要使用复杂的渐变——截图显示的是纯色、干净的背景色。
• 不要使用深色模式——该网站整体使用浅色、奶油色的配色方案。
• 不要在展示文字中使用 playful 或圆润的无衬线字体——截图使用 transitional-serif 字体来呈现富有表现力的标题。
• 不要在组件上使用厚重的投影——截图显示了用于提升层次感的非常微妙、柔和的阴影。
• 不要使用明亮的霓虹色或原色——截图在柔和、温暖的调色板上使用了一个特定的、鲜艳的红色强调色。
• 不要使用多栏文本块——截图使用了充足的留白和居中的单栏布局以提升可读性。
• 避免: 杂乱或繁忙的布局
• 避免: 刺眼或霓虹色
• 避免: 过于复杂的排版

10

包内真实截图

抓自真实页面 · 真 computed styles

11

System Prompt

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