Cup of Couple 网站预览
Cup of Couple 网站预览

Cup of Couple

浅色基底、大字排版与细线分隔。

页面以浅色为基底,搭配深灰色文字。字体采用 ITCFranklinGothicStdBook、Garamond。视觉特点包括大字排版、细线分隔、宽松留白、摄影展示。适合参考的场景:内容网站首页、编辑专题页。

查看原始网站

使用规范

建议采用

  • 每个排版元素都使用400字重;系统没有粗字重,层级只来自字体家族和字号。
  • 正文和元数据采用ITCFranklinGothicStdBook 10–17px;Garamond 17–28px留给卡片标题,PerpetuaTitlingMT 25–48px留给主要标题。
  • UI元素通过1px的#303030或#808080细线分隔;绝不用阴影、填充或超过1px的边框。
  • 所有角都保持0px圆角;图像、卡片和容器始终平直、矩形,以保留印刷和拼贴感。
  • 摄影承载全部色彩与暖意;UI附属元素必须保持无彩色,采用白色、#f0f0f0、灰色和#303030。
  • 每个卡片标题下方都放置全大写、以竖线分隔的分类标签,例如“FASHION | STUDIO”,字体为ITCFranklinGothicStdBook 10px。
  • 卡片内部标题、标签行和日期行之间保持一致的12px纵向节奏,主要分区之间为36px。

建议避免

  • 不要引入粗体、半粗体或任何高于400的字重;系统的克制依赖这一点。
  • UI附属元素不要添加蓝、红、绿等任何彩色;若状态需要强调,使用更粗或更深的灰色线条。
  • 卡片不要使用圆角、box-shadow或背景填充;让图像和留白分隔内容。
  • 文字标志之外不要使用DisplaceKC;它是品牌唯一的排版奇观。
  • 同一内容行中不要叠用超过两种字体家族;节奏只有衬线标题加无衬线元数据,不添加其他语气。
  • 不要使用装饰渐变、图像彩色叠加层或带色调的UI表面;只有摄影中的暖色调提供彩色。
  • 标题行高不要高于1.20,说明不要高于1.05;紧密纵向度量是编辑式的标志性特征。