Tesla 网站预览
Tesla 网站预览

Tesla

白色基底、大幅摄影展示与大字排版。

页面以白色为基底,搭配深蓝色文字。局部操作控件以蓝色强调。字体采用 Universal Sans Display、Universal Sans Text。视觉特点包括大幅摄影展示、大字排版。适合参考的场景:摄影作品集、视觉内容展示页。

查看原始网站

使用规范

建议采用

  • 每个主要部分都应以满幅覆盖、高质量的产品图像作为开场。
  • 在背景图片上,文字和行动号召(CTA)应居中对齐。
  • 使用特斯拉蓝色(#3e6ae1)专用于主要和高优先级操作,如‘立即下单’。
  • 将一个实心的主要行动号召(CTA)与白色或透明描边的次要行动号召(CTA)搭配使用。
  • 在所有UI区域(除主要行动号召外)保持严格的无彩色调(白色、灰色、黑色)。
  • 所有内边距、外边距和圆角均使用4px基础单位(例如,4px、8px、16px、24px)。
  • 保持界面边框元素,如标题栏和页脚,视觉上简洁且不显眼。

建议避免

  • 不要将特斯拉蓝色(#3e6ae1)用于文本、标题或装饰元素。
  • 不要在UI配色中引入任何饱和色。
  • 不要使用复杂组件;优先采用简洁的堆叠文本和按钮布局。
  • 不要在UI元素上使用大阴影、渐变或强烈的视觉效果。
  • 不要创建文字内容远超图像的布局。
  • 不要使用大于8px的圆角半径。
  • 不要使用衬线字体或具有表现力的展示字体;保持中性、技术性的排版语气。