OpenDesign·你的设计资产库

网页参考

Aplos

一个高端的直接面向消费者品牌,专注于精致的植物基饮品,以深邃的暗调影像与优雅的衬线排版为特色。

ConsumerPhotographicPremiumCleanProduct

封面待补录,可通过原站查看设计。

01

设计气质 DNA

无酒精精致植物基健康

一家面向零烈酒的现代奢华药剂店。

02

色彩

#000000Ink
#646464Ink soft
#F2F1EDBG soft
rgba(180,174,172,1)Line

以高对比度单色为基底,搭配温暖的离白色表面,确保可读性与视觉焦点。

03

字体

transitional-serif · humanist-sans

  • display40px · 400
  • subtitle26px · 400
  • body13px · 400

04

间距

3px
6px
12px
24px
48px
96px

严格遵循 3px 的倍数,主要间距为 12px 与 24px。

05

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

sm · 3px
md · 5px
lg · 12px
pill · 999px

采用细微的 1px 边框与内阴影来定义输入框与容器。

rgb(180, 174, 172) 0px 0px 0px 1px inset

06

布局

1280container
12columns
24pxgutter
768 / 1024breakpoints

全出血深色英雄区,搭配大型居中模态覆盖层。

07

动效与交互

200msmicro
300mssmall
800msmedium
cubic-bezier(0.645, 0.045, 0.355, 1)easing

交互元素的平滑背景与颜色过渡 · 填充与悬停状态的变换动画

交互元素上的微妙颜色与背景过渡。 · 通过标准指针光标提供即时视觉反馈。

08

组件

  • button 高对比度的黑色胶囊形或大圆角按钮,采用白色文字用于主要操作。
  • card 分屏模态界面,一侧为电影感图像,另一侧为简洁、功能性的表单。
  • input 简洁的文本输入框,带有细微的 1px 内阴影与微圆角。
  • hero 大尺寸摄影英雄区,配合氛围光效与叠加排版。

09

文案语气与禁用清单

  • 语气 精致、自信且富有吸引力。
  • 标题风格 采用字间距紧凑的大型精致衬线标题。
  • 按钮文案 直接且以行动为导向,例如“立即购买”或“继续”。
  • 勿使用明亮的强调色——截图显示严格的黑白与离白色调色板
  • 勿使用大圆角按钮——截图显示按钮采用更微妙的现代圆角(5px)
  • 勿使用通用无衬线字体作为展示字体——截图显示所有主要标题均采用过渡衬线体
  • 勿使用杂乱的多栏版式——截图显示简洁、聚焦的分屏模态与全出血英雄区
  • 勿为网站主体使用浅色、轻盈的背景——截图显示主导性的深黑背景
  • 勿使用强烈的投影——截图显示用于界定的细微内阴影与边框
  • 避免: 鲜艳的霓虹色
  • 避免: 俏皮或过于随意的语言
  • 避免: 杂乱拥挤的版式
  • 避免: 通用的无衬线标题

10

包内真实截图

历史提取与模型分析 · 尚未逐项校验

11

System Prompt

该设计呈现一个专注于零烈酒的高端直接面向消费者饮品品牌。它运用了一种精致、极简的美学风格,以深黑色(#000000)与温暖的离白色(#F2F1ED)表面为主导。排版方面,展示字体采用精致的过渡衬线体,正文与界面元素则使用清晰的人文无衬线体。关键交互模式包括高对比度、大圆角的主要按钮,以及用于表单字段的细微内边框。重要约束:严格避免使用鲜艳的强调色,绝不可使用通用无衬线体作为标题,并维持这种克制、以摄影为主导的版式。

把这份品味接进你的 Agent

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

OpenDesign 技能 ↗

复制给 Agent

参考链接与来源说明,可复制给 Agent。