精选 · 开放 · 免费

Sometimesalways Com Au

一家精品在线瓶装酒店，提供有趣饮品，设计温暖、有趣且经过精心策展。

01

设计气质 DNA

一家友好的本地瓶装酒店，拥有经过策展的、编辑性的美学。

02

色彩

温暖、大地色的背景，搭配高对比度的黑色排版，并使用充满活力的橙色作为交互元素的强调色。

03

字体

didone-serif · grotesque-sans

• display50px · 400
• h140px · 400
• body20px · 400
• caption12px · 400

使用 SunsetSerial-Light 作为主标志和衬线装饰字体。 · 使用 Founders Grotesk 作为所有正文文本、导航和 UI 元素的字体。 · 谨慎使用粗体，主要用于句中强调。

04

间距

交互元素使用宽裕的内边距（20px），网格布局中保持一致的间隙（20px）。

05

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

1px solid black 或 #333333

0px 2px 0px 0px rgba(0, 0, 0, 0.035) · 0px 5px 40px 0px rgba(0, 0, 0, 0.16) · 0px 8px 24px 0px rgba(0, 0, 0, 0.16)

06

布局

全宽促销横幅，带有圆角的英雄区域，随后是用于产品列表的响应式网格。

07

动效与交互

按钮和链接悬停状态的不透明度和 transform 过渡。 · 交互元素上的平滑颜色过渡。

链接和按钮上的微妙不透明度变化或颜色偏移。 · 即时响应，过渡平滑。

08

组件

• button 药丸形按钮，内边距宽裕，通常带有细 1px 边框。
• card 图像优先的卡片，大圆角（20px 或 40px），下方文字最少。
• chip 小型药丸形标签（例如 'Progressive', 'Traditional'），带 1px 边框。
• input 简单的文本输入框或搜索框，样式极简。
• hero 大型圆角图像容器，品牌名称以衬线字体叠加显示。

09

文案语气与禁用清单

• 语气 友好、平易近人且略带趣味。
• 标题风格 直接、随意，有时使用有趣的箭头（→）代替破折号。
• 按钮文案 清晰且以行动为导向，常使用大写文本。

• 不要使用冰冷、临床的白色背景——截图显示的是温暖的桃色背景。
• 不要使用严格极简、稀疏的布局——截图显示的是内容丰富、图像密集的编辑式布局。
• 不要在卡片上使用锐利的 0px border-radius——截图显示所有卡片和图像都采用 20px 或 40px 的大圆角。
• 不要使用僵硬、刻板的字体——截图显示的是一种有趣的衬线字体和一种简洁的 grotesque sans 的组合。
• 不要使用高对比度的深色模式——截图使用的是温暖、浅色的调色板。
• 不要使用复杂、多彩的渐变——截图依赖于纯色的暖色和摄影图像。
• 避免: 过于正式或生硬的语言
• 避免: 密集、难以阅读的文本块
• 避免: 僵硬、企业化的设计模式

10

包内真实截图

抓自真实页面 · 真 computed styles

11

System Prompt

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