Acceptandproceed 网站预览
Acceptandproceed 网站预览

Acceptandproceed

近白色基底、胶囊形控件与细线分隔。

页面以近白色为基底,搭配近黑色文字。字体采用 Messina Sans、Letterformvariations 04 Dmgx。视觉特点包括胶囊形控件、细线分隔、摄影展示、非对称构图。适合参考的场景:设计工作室首页、案例展示页。

查看原始网站

使用规范

建议采用

  • 从 8px 说明文字至 72px 标题,全部采用 Messina Sans 400 字重;不引入粗体或中等字重,层级只来自尺寸。
  • 仅使用暖奶油色板:画布 #f9f7f3、凸起交互表面 #ecebe7、文字与细线 #000000,不使用任何彩色。
  • 全部主要操作按钮和输入框采用 100px border-radius,胶囊形是主要按钮形状。
  • 项目图像与卡片容器采用 8px border-radius,细微圆润既保持印刷清晰感,又避免尖角。
  • 内容分区以 1px #000000 细线边框分隔,而非彩色条带或背景变化;页面像连续纸张,而非分段面板。
  • 首屏和功能分区的摄影填满整个视口宽度;图像就是页面,文字和界面框架退后。
  • 全部徽章和标签块采用 3.4px border-radius;这种既非完全圆润、也非尖锐的微圆角像编辑标签。

建议避免

  • 不引入粗体、半粗体或任何非 400 字重;单一字重就是全部字体语气,粗标题会破坏编辑低语。
  • 不添加彩色,包括蓝链接、红错误或绿成功;状态变化使用 #000000 ↔ #8c8c8c 不透明度变化,或 #f9f7f3 ↔ #ecebe7 表面阶梯。
  • 任何元素不使用投影或 box-shadows,深度只由表面颜色和细线表达。
  • border-radius 不超出四级体系:3.4px 徽章、8px 卡片/图像、20px 辅助按钮、100px 胶囊形/输入框;不用 4px、12px 或 16px。
  • 标签不采用大写字间距或增加 letter-spacing;-0.01em 收紧贯穿字体尺度,不放宽。
  • 不添加图标、插画或装饰图形;摄影是唯一图像,其余只有文字与细线结构。
  • 不使用彩色悬停状态;链接和按钮在 #000000 与 #8c8c8c 文字/边框间切换,或采用 #ecebe7 → #f9f7f3 表面反转。