看得见的部分

美是最后加冕的那一层,不是遮羞布。

这一页说的是未夜的东西看起来应该是什么样,以及这个站为什么长这样。视觉在决策金字塔里排第六,永远不用来修补前五层的缺陷。

美学关键词五个字

  • 有纵深的暗色与层次,不是扁平的黑。

  • 画面里没有正在争抢视线的元素。

  • 每一个像素、每一处对齐都有理由。

  • 边缘、过渡、反馈都不生硬,不刺人。

  • 留白是内容,不是待填的空位。

明令禁用赛博朋克霓虹、元宇宙浮夸、故障艺术、科技蓝网格线、粒子星空这一类「看起来很智能」的视觉套路。未夜的智能不需要打扮成智能的样子。

色彩未完成的天空

主色域取自黎明将明未明、黄昏将暗未暗的那一段:深青、蟹壳青、暮蓝、灰紫、天光白。下面是这五个色名在本站的实际取值。

  • 暮蓝页面底色,将暗未暗
    #0f1a24
  • 深青最底层与页脚
    #0b141c
  • 蟹壳青链接、焦点、唯一的光
    #86c5c0
  • 灰紫次级强调
    #b3aad3
  • 天光白正文
    #e9eef2

选它的理由写进色彩的每一次使用里:未完成的天空是一天中最安静、也最充满可能的时刻——黑夜正在退去,喧嚣尚未到来。这正是未夜对自身的期许:站在可能性打开的那个时刻,安静地亮着。

饱和度克制,对比度务实——可读性优先于氛围。本站正文与底色的对比度约 15 比 1,最薄的一对文字也在 5 比 1 以上;每一对颜色都由程序实测并记录,改色必须重测。警示色只留给真正的警示;不用制造紧迫感的高饱和红与倒计时橙作装饰。

有方向,无噪音

光用来指出「往这里看」——层级、焦点、当前状态——不用来炫目。光有明确的来源与方向,不四处乱溅;发光的元素在同一时刻至多一个;光的强度与信息的重要性成正比,而不是与运营的意愿成正比。

任何让人眯眼、分神或找不到焦点的光效,无论多好看,都删除。本站唯一的一处光,在首页第一屏的地平线下。

图形语言五个母题

边界
用细而确定的界线表达秩序与克制。
微光
用低强度的光晕表达在场的智能,不用爆炸式高光。
留白
大面积的空,让内容与人都能呼吸。
渐隐
元素的出现与离场都用渐变完成,不突兀弹跳。
不闭合
图形保留开口,圆不画满,线不封死——象征未完成、尚在生长的可能性。本站的圆环都留了一道口。

五个母题组合使用,构成一眼可辨、却说不出哪里在用力的气质。

标识四条原则

  • 单色成立——在纯黑、纯白、单色印刷下依然完整,不依赖渐变与特效存活。
  • 小尺寸成立——缩到 16 像素的收藏夹图标依然可辨。
  • 安静——不含动态、不含光效,不追热点变体;节日不换装,事件不蹭形。
  • 退后——在产品界面中永远小而稳,不与你的内容争夺空间。产品做得好,标识才有意义。

动效与声音动效只有三个职责,声音只为告知

  1. 01解释展示因果:这个东西从哪来、到哪去、和什么有关。
  2. 02定向维持空间感:层级切换、页面转场时让人不迷路。
  3. 03安抚确认收到:操作已生效、系统在工作、不必担心。

不承担这三个职责之一的动效,一律不做。时长以「感知到但不等待」为准;尊重系统的「减少动态」设置。动效永远不用于奖励刺激、拉长停留或制造兴奋——那是老虎机的工艺。

声音只在视觉不在场或不够用时出现:后台任务完成、需要立即注意的异常、免视操作的确认。质感低、短、圆润,像图书馆里有人轻轻放下一本书。不用变奏上扬的「奖励音」、开箱音、金币音——一切旨在诱导重复行为的声音,我们不做。

这个站本身按同一套规矩做

  • 没有脚本。这个站不运行任何程序代码(零 JavaScript),不向别处发请求,不统计你,不放 Cookie。
  • 没有构建。十几个纯文本文件,不依赖任何框架,浏览器直接打开。
  • 没有动画。只有 180 毫秒的颜色过渡和点击页内链接时的平滑滚动;开了「减少动态」,两者都关。
  • 读得清。正文 17 像素、每行三十余字,高对比模式下边线与图形符号仍然可见;打印时去掉页眉页脚,只留正文。

本页摘自我们的内部手册《未夜品牌操作系统 V1.0》第四篇(美学关键词、色彩、光的原则、图形语言、动效三职责、声音原则)与标识原则。最后核对:2026-09-02。