精选 · 开放 · 免费
Your Majesty
一个融合了大胆衬线字体与沉浸式三维及摄影媒体的奢华创意机构网站。
agencycreative
01
设计气质 DNA
奢华高端创意机构以人为本
如同高端时尚编辑与数字画廊的融合。
02
色彩
#000000Ink
#FFFFFFBG
#D8D8D8Muted
rgba(0,0,0,0.1)Line
以高对比度单色为基底，让三维图形与摄影媒体作为主要的色彩焦点。
03
字体
transitional-serif · humanist-sans · monospaced
- display
70px · 300 - display-lg
30px · 400 - body
16px · 400 - caption
13px · 400
标题采用高对比度的过渡衬线字体，行距紧凑。 · 界面标签与标签使用等宽字体，全大写并采用宽字距。 · 正文使用清晰的无衬线字体以确保可读性。
04
间距
4px
8px
16px
24px
32px
48px
64px
96px
通过充裕的留白强调画廊式的布局节奏。
05
表面 (圆角 / 阴影 / 边线)
sm · 4px
md · 5px
lg · 12px
pill · 9999px
1px solid rgba(0,0,0,0.1)
0px 2px 6px rgba(0,0,0,0.1)
06
布局
1440container
12columns
24pxgutter
768 / 1024breakpoints
采用非对称瀑布流网格，三维与摄影卡片相互重叠，铺设在宽阔的排版基底之上。
07
动效与交互
150msmicro
250mssmall
500msmedium
cubic-bezier(0.25, 0.1, 0.25, 1)easing
媒体元素采用淡入过渡效果 · 悬停时进行平滑的颜色与滤镜变化
交互元素悬停时产生细腻的颜色变化或滤镜调整。 · 按钮与链接点击时提供即时视觉反馈。
08
组件
- button 采用深色胶囊形按钮，搭配等宽大写文本。
- card 带有圆角的大型垂直卡片，包含标签与富媒体内容。
- chip 小型圆角标签，采用深色背景与白色等宽文本。
- input 极简输入框，可能采用底部边框或浅色背景。
- hero 采用左右分栏布局，左侧为大型衬线文字，右侧为动态媒体网格。
09
文案语气与禁用清单
- 语气 权威、精致且富有前瞻性。
- 标题风格 采用大型衬线字体，呈现大胆、富有感染力的陈述。
- 按钮文案 直接且大写，通常采用等宽字体。
- 避免使用活泼或圆润的无衬线字体——截图显示标题使用了优雅的过渡衬线字体。
- 避免使用繁忙的多彩背景——截图显示为干净、纯粹的白色画布。
- 避免将所有内容居中对齐——截图显示为强烈的左对齐排版层次。
- 避免使用标准的矩形卡片——截图显示为略带圆角（5px）且相互重叠的元素。
- 避免为界面标签使用小而密集的文本——截图显示为采用宽字距的大写等宽标签。
- 避免引入明亮、高饱和度的强调色——截图依靠三维渲染图与照片来提供色彩。
- 避免: 随意口语
- 避免: 杂乱布局
- 避免: 鲜艳的霓虹色彩
10
包内真实截图
桌面首屏（hero）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
移动首屏抓自真实页面 · 真 computed styles
11
System Prompt
这是一个为‘Your Majesty’设计的奢华创意机构网站。它采用高对比度的单色配色方案（#FFFFFF背景，#000000墨色），作为承载丰富媒体的中性舞台。排版以大型、优雅的过渡衬线标题为特色，搭配清晰的humanist-sans无衬线正文以及采用宽字距的等宽字体用于界面标签。布局采用非对称瀑布流式网格，使用大型、略带圆角的卡片。避免使用活泼字体或随意语言；保持权威、精致的基调。避免使用明亮的强调色，而是让三维图形与摄影内容提供视觉吸引力。确保充足的留白和左对齐的文本块以保持编辑式的感觉。
en · zh-CN · zh-TW · ja · ko