---
title: "#141414 深灰画布与三层表面阶梯"
description: "为什么不用纯黑 #000000？深入分析 OLED 像素拖尾残影、阴影深度保留与 Tuff 三层深灰空间阶梯。"
---

# #141414 深灰画布与三层表面阶梯

在暗色模式普及初期，不少产品为了宣称“完全关闭 OLED 像素”，将背景粗暴设为绝对纯黑（`#000000`）。在实际人机工效学中，这造成了严重的体验灾难。

## 为什么绝对纯黑 #000000 是个误区？

纯黑 `#000000` 存在两大不可调和的缺陷：
1. **对比度压迫（Glare Contrast）**：纯白文字在纯黑底板上的反差达到极致的 21:1，在暗光环境中会产生强烈的眩光刺眼感，视网膜极易疲劳。
2. **消灭了阴影层级**：阴影的物理本质是遮挡漫射光产生的暗区。如果底板已经是绝对的 0 亮度，下层投影直接隐形，整个 UI 的三维深度感被彻底压扁。

## OLED 像素点亮延迟（Purple Smearing）

在 OLED 和 AMOLED 屏幕上，`#000000` 意味着自发光子像素彻底断电关闭。
当内容滚动时，关闭的二极管重新点亮需要数十毫秒的物理响应时间。此时，文字和卡片边缘会在黑色背景上拖出明显的**紫色/墨水状拖尾残影（Purple Smearing）**，在低亮度下尤为明显，极易引起眩晕。

## 阴影深度（Elevation）的物理要求

若要表达卡片悬浮于底板之上，卡片下方投射的弥散阴影必须能“沉”到底板下方：
$$\text{Luminance}(\text{Shadow}) < \text{Luminance}(\text{Canvas})$$
因此，底板画布必须保留微弱的基础亮度，才能承载阴影衰减，让界面形成深邃立体的空间纵深。

## TuffEx 三层深灰空间阶梯

Tuff 选定 `#141414`（极深温和碳灰）作为画布基底，并建立了严谨的深灰阶梯：

| 空间层级 | 令牌与色值 | 物理感知 | 典型应用 |
|---|---|---|---|
| **底板层** | `--tx-bg-color: #141414` | 吸收环境杂光的深空 | 桌面窗体底板、全局空白视口 |
| **容器层** | `--tx-bg-color-overlay: #1d1e1f` | 带有微弱漫反射的哑光表面 | 卡片、对话框、抽屉、弹出浮层、Toast 面板 |
| **高亮层** | `--tx-fill-color-light: #262727` | 凸起于底盘的操作介质 | Hover 悬停态、选中高亮行 |

暗色下 `--tx-fill-color-blank` 是 `transparent`，不承担容器色。

这一色阶完全规避了 OLED 像素点亮延迟，同时为光照与阴影提供了完整的物理呼吸空间。

:::TuffDemoWrapper{demo="ConceptDarkCanvasDemo"}
:::