Perplexity AI 网站预览
Perplexity AI 网站预览

Perplexity AI

学者的羊皮纸后方配以洁净玻璃

Perplexity的界面呈现出温暖纸张研究台的质感:浅米色的羊皮纸画布(#faf8f5),搭配沉静的深黑色文字,细灰分隔线,以及唯一克制的青绿色,用于标识导航和激活状态。组件保持紧凑且低层级——柔软的16px圆角卡片、透明描边按钮、胶囊形控件——让中央搜索输入成为视觉焦点。文字采用定制的几何无衬线字体(pplxSans),字重适中,行高充足,营造出平和、易读的表面,信任内容密度而非炫技。

查看原始网站

使用规范

建议采用

  • 使用Parchment(#faf8f5)作为所有全页背景的基础画布——除非明确需要,否则绝不替换为纯白色(#ffffff)
  • 将正文内容设为Ink(#27251e),仅在最大字重的UI元素中使用Pure Black(#000000)
  • 保留深青色 (#016a71) 专用于:活动导航状态、"新品" 标签填充,以及搜索输入框周围的装饰性光晕。
  • 卡片使用16px圆角,输入框和填充按钮使用12px圆角,透明描边按钮使用6px圆角,胶囊和徽章使用9999px圆角
  • 文字字重仅限于400至500之间——界面依赖色彩与间距来建立层级,而非字重
  • 为卡片和按钮的边框应用1px Warm Mist(#d1d1cd)细线;避免使用2px及以上更粗的边框
  • 采用pplxSans字体层级:16px/1.5用于正文,14px/1.43用于UI标签,12px/1.33用于微标签,11px/1.5用于徽章

建议避免

  • 不要引入新的强调色——系统刻意保持单色,仅有一个青绿色;任何第二色的引入都会破坏品牌的克制感
  • 不要使用粗体(600及以上)字重——pplxSans最大仅到500,设计依赖这种平和感
  • 不要在组件上添加超出单层1px细微阴影的投影——界面本意是扁平的
  • 不要将纯白色(#ffffff)作为表面色——始终搭配Parchment(#faf8f5)或Soft Paper(#fdfbfa)以维持温暖纸张的质感
  • 不要将青绿色用于正文内容中的文字或图标——青绿色仅用于填充和选中状态的背景
  • 主要内容列的最大宽度不得超过900px——布局本就以居中和狭窄为设计原则
  • 不要在组件表面添加渐变、模糊或装饰性图像——视觉语言严格保持扁平与纹理感