Studio Thomas 网站预览
Studio Thomas 网站预览

Studio Thomas

暖白色基底、大幅摄影展示与满幅色块。

页面以暖白色为基底,搭配近黑色文字。字体采用 Moderat。视觉特点包括大幅摄影展示、满幅色块。适合参考的场景:创意机构官网、项目作品集。

查看原始网站

使用规范

建议采用

  • 仅在完整、坚定的块中使用信号橙色(#ff4f00)——如首屏区块、节区分隔线或强调矩形。禁止作为小点、图标色调或文字颜色使用。
  • 显示字体设为120px字重300,行高1.0,字间距-0.004em。此为标志性尺寸——任何更小的字号都会削弱编辑风格。
  • 使用原始亚麻色(#ebe9e3)作为页面画布,而非纯白色。温暖的米白调是该系统区别于普通白页SaaS布局的关键。
  • 页眉仅保留字标加汉堡按钮。禁止在顶部栏添加导航链接、搜索栏或次级操作。
  • 所有大尺寸及显示字体均使用字重300。仅将字重400用于正文(16px)和功能UI文字。
  • 项目展示的摄影应填满整个视口边缘到边缘。禁止限制在最大宽度容器内或添加边距。
  • 区块间使用100px垂直间距(页脚令牌),内容区块使用40px内边距。

建议避免

  • 禁止引入次级强调色。该系统为单色加橙色——添加蓝色、绿色或其他任何色调都会削弱整体色彩承诺。
  • 任何元素均不使用圆角。该系统为无边框——按钮、卡片、输入框和标签均为锐角(0px圆角)。
  • 禁止使用粗体或黑色字重(600-900)。Moderat仅加载300和400字重;使用更重的字重会破坏克制的语气。
  • 禁止使用阴影、光晕或立体效果。表面为平面——区分来自色彩块和满幅边缘,而非深度。
  • 不要创建带有填充的CTA 按钮。系统中没有 ACTION_BACKGROUND 证据——交互是文本链接和带有边框的文本,而不是填充按钮。
  • 禁止将项目摄影置于带边框、背景或内边距的卡片中。图片本身就是容器。
  • 禁止使用渐变。该系统完全为平面色彩——全系统未检测到任何渐变使用。