UI通用设计基础——视觉——风格色彩

1. 色彩设计理念与基础色调
   • HarmonyOS NEXT 色彩设计注重品牌色展示与系统色彩对比，以实现视觉连续和界面关联，面向所有人群，秉持包容理念。其系统色调受 “鸿蒙宇宙” 世界观启发，宇宙蓝和雪域灰构成基础，宇宙蓝带来纯净宁静，雪域灰用于卡片背景烘托纯净感。
2. 色彩分层构建
   • 构建对比关系：色彩分层的核心是构建不同使用场景下的对比关系，每个颜色都有专属 ID。这有助于处理不同层级间的对比差异，并保证同层级色彩一致。系统组件虽有默认分层参数，但应用自定义组件规格时，需重新梳理背景、文本等色彩的正确映射关系，以确保色彩在不同组件和层级中的协调性与合理性。
   • 保障可阅读性：色彩搭配必须满足常规阅读对比度，系统默认颜色保障最小 3:1 对比度。在深色模式下，色彩的映射关系会部分改变，这是为了适应不同的视觉环境，确保用户在各种模式下都能清晰识别界面上的信息，避免因色彩对比度不足而导致的阅读困难或视觉疲劳。
   • 最小集的色彩管理：在 HarmonyOS 的色彩体系中，可以最小级的管理系统色彩数量。基于常规色四件套，即通过合理运用有限的基础色彩，便可搭建系统整体的色彩风格。这种管理方式既能保证色彩的多样性和丰富性，又能避免色彩过多导致的混乱和不协调，提高了色彩管理的效率和效果。
3. Token 参数运作机制
   • 什么是token: 具有用于固定场景的 Token 名称，分为文本类、图标类、组件类和交互事件类等，定义了系统中大部分的使用场景。每个语义 Token 参数都与基础 Token 具备一定的引用关系，应用自定义的参数也可基于使用场景自定义引用链路，确保色彩在不同场景下的准确应用，提升界面的语义表达和视觉引导性。
   • 参数分类与层级：分为控件私有、通用语义、通用基础三个层级。基础 Token 如 primary 等经计算生成对比度色彩用于界面元素，可直接引用或重定义语义；语义 Token 对应固定场景且与基础 Token 关联，应用可自定义引用链路；控件 Token 针对控件内元素，具唯一性。
   • 参数使用规则：在浅色和深色模式下，部分 Token 名称相同但数值有别。如 brand 等基础 Token 可单独定义色彩，其原色指定后通过 Alpha 值实现映射，不同透明度对应特定 Token name，修改映射关系需考虑控件默认引用逻辑。
4. Token 参数在不同元素中的应用
   • 文本色与图标色：基于 Primary、onPrimary 和 Brand 确定色彩来源，分五个层级展示，依透明度区分核心与辅助内容，反色场景用特定 Token name，高亮色引用 Brand 且随其变化。
   • 组件容器色：源自 Brand 和 Container，区分背景层级。控件容器色分多种类型，容器类随深浅模式变，展示类用品牌色或低透明度色，还有交互事件色对应不同操作状态。
   • 界面背景色：用于窗口分层，多屏和悬浮窗场景动态替换灰阶层级。浅色通用白色和深色黑色为基础色，从 gray_02 起依灰阶对比度调整层级，不可用透明色，特殊情况可作组件背景。