Dezeen 网站预览
Dezeen 网站预览

Dezeen

白色基底、网格布局与大幅摄影展示。

页面以白色为基底,搭配近黑色文字。局部操作控件以橙色强调。字体采用 Chronicle Text G1 A、StandardCT。视觉特点包括网格布局、大幅摄影展示。适合参考的场景:内容网站首页、编辑专题页。

查看原始网站

使用规范

建议采用

  • 每个链接、导航项和可交互文字信号都使用Gallery Indigo(#556e9b);它是正文内容中唯一的彩色语气,必须保持一致。
  • 所有卡片、弹窗、输入框和按钮的border-radius都设为0px;清晰直角是画廊墙感受不可更改的要求。
  • 所有内容都以1200px max-width居中置于Gallery White(#ffffff)上;内容分区绝不要使用满幅深色背景。
  • StandardCT 700是唯一的标题字重,字号为19/27/40px;不要引入更轻字重或第二款展示字体。
  • Signal Orange(#ff7617)只留给悬停和强调状态;任一时刻使用它的交互元素应少于5%。
  • 保持80px分区间距和9px元素间隙作为间距节奏;充裕的纵向呼吸空间是标志性密度。
  • 所有提交或CTA操作都呈现为Chronicle 700、Press Black颜色的文字链接,绝不用填充按钮;界面应像报纸,而非应用。

建议避免

  • 不要给卡片、弹窗或任何内容表面添加投影;系统唯一的阴影是蓝紫色标题横向扩散。
  • 图像、卡片、输入框或按钮不要使用圆角;设计刻意保持清晰直角。
  • 不要引入额外品牌色或强调色相;调色板只有Gallery White、Press Black、Gallery Indigo和Signal Orange。
  • 主要操作不要使用填充或描边按钮形状;采用Press Black或Gallery Indigo文字链接。
  • 标题行高不要低于0.95,也不要高于1.37;紧密的编辑式横带是标志性特征。
  • 文章卡片不要添加背景色或浅色调;它们必须浮在白色画布上,不设置独立表面。
  • 标题不要使用Arial或Helvetica等系统无衬线字体;必须采用StandardCT,或几何粗体替代字体,才能保持编辑式语气。