C · Style DNA
What fits, what doesn't.
适用场景
- 顾问公司 landing
- 创意 / 设计代理
- 个人作品集
- 严肃品牌 / 出版
不适用
- 童趣 / 高饱和品牌
- 数据密集 dashboard
- Gen Z 应用
- 创意 demo 实验
审美关键词
大字
大间距
serif + sans
黑白
留白
克制冲击
D · Craft Details
The 4 disciplines.
调色板01 / 04
黑白基调 + 1 暖米纸张 + 1 微金 accent·让"层级 = 字号 / 字重 / 留白"来工作·不靠颜色。
#FFFFFF
#FAF8F3
#525252
#0A0A0A
#E8E6DF
#A3A3A3
#B8985A
accent only
字体系统02 / 04
Fraunces 巨大 serif 做 hero / heading·Inter regular 做 body·**禁用 monospace 做装饰**·只在数据 / metadata 用。
DISPLAY / HEADING
Fraunces 900
BODY
Inter Regular · for body
META / DATA
JetBrains Mono · uppercase
间距系统03 / 04
**大间距是这风格的灵魂**·section padding 160-240px·hero margin 顶 240px·让 hero 不被任何东西挤。
- 6 / 12 / 24inline gap
- 48component gap
- 96section gap
- 160-240hero padding
视觉特征04 / 04
不用圆角·不用 shadow·border-radius 0·layout 靠 1px hairline 切分·让"内容本身"承担权威。
- 01border-radius 0·零圆角
- 02无 box-shadow·靠 1px line 切分
- 03大字 hero 80-120px clamp
- 04tagline 带 left border 引文感
- 05monospace uppercase 做 metadata
E · How to talk to CC
Three phrases.
Nothing else needed.
STANDARD
按 high-end-agency 风格做这个 landing / 主页 / about 页
VARIANT
走 high-end-agency + 加一个微金 accent / 留更多白 / 大字更巨
REMIX
high-end-agency hero + editorial-magazine 正文区
CC receives this style ID·
auto-loads
frontend-design + typography reference·按本页 4 件 craft 实现·**不会冒出 Inter / 圆角 / shadow / 渐变文字**·这些是 high-end-agency 的 DON'T。
F · Components
Three artifacts
worth showing.
BUTTON
CARD
A brand for
quiet ambition.
quiet ambition.
HERO
Built to last
Est. 2024
G · Related Skills
Composable with.
I · Similar styles · 看完也许你还想看
Similar in spirit,
different in execution.
An editorial magazine layout with serif typography and elegant column composition rooted in print design heritage.
Editorial Magazine
editorial-magazine
同为serif 印刷感 + refined editorial 调性·区别·长文 / 媒体内容场景 vs 顾问公司 landing
TYPE / 01
26°
Swiss International
swiss-international
同为黑白基调 + refined + 严谨·区别·几何 sans + 严格网格 vs 大 serif + 大间距
设 计
印
Chinese Modern
chinese-modern
同为refined + editorial + 大留白·区别·中文 serif + 朱红 + 国风 vs 英文 serif + 黑白