精选 · 开放 · 免费
Typology
专注于纯净成分与科学精准的极简高端护肤品牌。
beautyskincare
01
设计气质 DNA
干净科学极简高端护肤
现代药剂师风格与高端编辑杂志的融合。
02
色彩
#141414Ink
#4F4F4FInk soft
#FFFFFFBG
#F4F4F2BG soft
#FBF9F7BG quiet
#909090Muted
rgba(212, 212, 212, 1)Line
单色克制，搭配高对比度字体，唤起临床纯净感。
03
字体
grotesque-sans · monospace
- display
64px · 500 - h1
48px · 500 - h2
32px · 500 - body
15px · 400 - small
13px · 400 - micro
10px · 400
导航与功能文本始终大写。 · 标题使用紧凑字距与粗体字重。 · 正文保持干净、中性的无衬线外观。
04
间距
4px
8px
12px
16px
20px
24px
32px
48px
64px
96px
基于4px的统一网格，搭配充足留白，营造通透高端感。
05
表面 (圆角 / 阴影 / 边线)
sm · 4px
md · 8px
lg · 12px
pill · 9999px
纤细的1px黑色或深灰色边框，仅用于分隔与按钮，使用克制。
rgba(0, 0, 0, 0.3) 0px 30px 70px 0px
06
布局
1280container
12columns
24pxgutter
768 / 1024breakpoints
全宽摄影主视觉，后接清晰的结构化网格用于产品探索。
07
动效与交互
200msmicro
300mssmall
400msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
按钮与链接悬停状态的平滑过渡。 · 基于变换的动画提供微妙交互反馈。
微妙的背景色或透明度变化，通常伴有过渡效果。 · 即时视觉反馈，通常通过颜色变化实现。
08
组件
- button 高对比度矩形，文本大写；主按钮为黑底白字，次按钮为白底黑边框。
- card 干净无边框的卡片，搭配高质量产品图像与精准排版。
- chip 无 - 在可见截图中未出现。
- input 无 - 在可见截图中未出现。
- hero 全出血、高冲击力的摄影，叠加左对齐文字。
09
文案语气与禁用清单
- 语气 临床、直接且精致。
- 标题风格 简短、粗体且陈述性，常为全大写。
- 按钮文案 行动导向且清晰，始终大写。
- 避免使用圆润、浮夸的形状 - 截图显示为锐利的几何矩形与方形。
- 避免使用鲜艳、饱和的强调色 - 截图显示为严格单色色板。
- 避免使用装饰性或手写体字体 - 截图显示为干净的功能性怪诞无衬线体。
- 避免界面中出现过多边框或方框 - 截图显示为干净、无边框的布局，留白充足。
- 避免到处使用沉重的投影 - 截图显示为单一、微妙的深阴影，使用克制。
- 避免主要导航与行动号召使用小写 - 截图显示这些元素采用一致的大写样式。
- 避免: 过于随意或浮夸的语言。
- 避免: 过度使用感叹号。
- 避免: 模糊或华丽的营销术语。
10
包内真实截图
桌面首屏（hero）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
移动首屏抓自真实页面 · 真 computed styles
11
System Prompt
这是Typology Paris的高端极简护肤电子商务网站。设计DNA是临床、干净且精致的，依赖严格的单色色板（黑色、白色与米白/灰色）与功能性的怪诞无衬线字体（Post Grotesk）。布局宽敞且具有编辑风格，运用大比例摄影与粗体大写的标题与导航字体。关键十六进制颜色为背景使用#FFFFFF，柔和表面使用#F4F4F2，主要墨迹使用#141414。关键禁忌：绝不使用鲜艳的强调色，避免圆润或浮夸的形状，绝不使用装饰性或手写体字体。界面应感觉精准、科学且高端。
en · zh-CN · zh-TW · ja · ko