鸿蒙是什么风格？
鸿蒙是一套为多块屏幕准备的安静而精确的界面：冷灰底、白色大卡片、深藏青文字，以及只给“能点的东西”的那一抹系统蓝。
鸿蒙速览
鸿蒙是华为分布式操作系统的视觉语言，目标是让同一套界面可以在手机、平板、手表、车机和智慧屏上运行。它的外观刻意平静而精确：冷调浅灰的页面，圆角宽大的白色卡片，用深藏青而非纯黑的文字，以及只留给“用户可以触碰的东西”的一种系统蓝。
它的核心纪律是：颜色就代表可交互。凡是不能交互的东西都保持中性，因此蓝色从来不是装饰。按钮是胶囊形，设置被归入分组块，信息装在可以从应用里“取出来”放到别处的卡片中。乍一看它很朴素，因为它的雄心在于跨设备的一致性，而不在表面的戏剧效果。
作为一种设计风格，它容易辨认，也容易应用。它偏爱圆润的几何形、层与层之间柔和的分离，以及主要由字号、字重和间距构成的清晰层级。两个界面概念赋予它辨识度：从应用图标上滑出的服务卡片，以及“超级终端”——附近的设备以气泡形式出现，可以拖到一起。
鸿蒙从何而来？
鸿蒙由华为于 2019 年 8 月 9 日在广东东莞举行的开发者大会上发布。目标很直白：做一个把家庭或一个工作日看作“多台设备协同”的操作系统，让一项任务可以在一块屏幕上开始、在另一块屏幕上完成。2021 年 6 月，手机随 HarmonyOS 2 用上了它，大多数人也是在这时第一次在真机上见到它。今天用户熟悉的视觉形象，大致形成于 2021 年至 2024 年之间。
地点很重要。华为以广东的深圳、东莞为根据地，这个项目与余承东、王成录等名字联系在一起，他们都是与发布相关的人物。分布式操作系统对界面设计提出了不寻常的要求：同一个应用既要出现在手腕上，又要出现在车载中控上，布局就必须由小而可移动的部件和可缩放的参数构成，而不是固定的页面。这一要求解释了为什么这种风格如此模块化，为什么以卡片为中心的布局会居于核心。
它的外观汲取了几条脉络。分布式多设备操作系统是技术框架；卡片式移动界面——把信息和功能打包成圆润、自成一体的单元——提供了构件；全系统的设计参数，也就是每个产品都继承的一套共享的颜色、圆角和间距数值，提供了纪律。平台的开源一侧 OpenHarmony 公开了这些参数，这也是这种风格几乎可以直接翻译到网页上的原因。
这套设计系统做的就是这件事：它取用平台使用的系统色板和圆角参数，为网站重新诠释——服务卡片、分组设置块、胶囊按钮和“超级终端”气泡图，成为网页的构件。结果保留了平台的克制，也保留了那个承诺：同一套界面语言可以安稳地放在各种尺寸的屏幕上。
鸿蒙的视觉特征是什么？
只给触碰的一种蓝
系统蓝是页面上唯一强烈的彩色音符，标记链接、主按钮、开关和选中状态。由于没有别的颜色与它竞争，用户很快就学会：蓝色意味着“这里可以操作”。这比多数品牌色板遵循的规则更严格：连标志和插画都刻意避开它，让它的含义保持干净。
冷调灰底
页面背景是偏冷的浅灰，而不是白色。这层色调让纯白卡片不需要边框和重阴影就能向前浮起，也让整套界面有一种干净的日光感。中性表面承担结构，蓝色与深藏青的文字因此能保持锐利。
白色大圆角卡片
内容住在带有大而柔和圆角的白色卡片里。圆角足够大，成为一种标志，但又始终一致，嵌套的元素按比例递减，而不是混用随意的曲线。卡片是构图的基本单位：一个小组件、一组设置、一条通知，都是同一类对象的不同尺寸。
深藏青代替纯黑
主要文字是深藏青，次要信息用更浅的蓝灰。它读起来深沉有力，在灰底上又比纯黑更柔和，并与系统蓝协调，而不是互相较劲。层级由字号、字重和为数不多的灰阶构成，而不是靠许多色相。
胶囊控件
按钮、标签、搜索框和分段控件都是胶囊形，两端完全圆润。这让界面显得亲切、适合触控，主次操作也容易区分：实心蓝色胶囊表示主操作，浅色淡染的胶囊表示备选。这种形状还与周围的圆角卡片相呼应。
分组设置块
选项列表被收进同一个圆角块里，行与行之间用细分隔线，而不是显示为一个个独立的框。每行左侧是标签，右侧是数值、开关或箭头。这种模式是系统让密集信息显得平静的办法：相关项目成组，无关项目靠留白分开。
服务卡片与设备气泡
两个交互概念塑造了视觉识别。服务卡片是从应用图标里“抽出”一小块功能的紧凑卡片；“超级终端”视图则把附近的设备排成可以拖到一起的气泡。两者都把平台的核心主张——功能可以在设备之间流动——变成了用户看得见、做得到的东西。
谁塑造了鸿蒙？
华为高层人物，其名字与鸿蒙的公开发布和推广紧密相连。他是平台故事中的关键人物之一，与 2019 年华为宣布面向多种设备类型的分布式操作系统的那一刻联系在一起。
另一位与鸿蒙及其软件平台相联系的华为人物。他的名字属于与这套系统早期历史相关的人群，包括 2019 年的发布和 2021 年登陆手机。
平台的开源一侧，公开了系统色板和圆角参数，这套设计风格正是据此翻译到网页上的。正因为这些参数公开，这种视觉语言才能在华为自家产品之外被研究、复现和改编。
今天怎么用鸿蒙？
鸿蒙适合那些需要显得可靠、轻盈、跨平台的产品：多设备应用、IoT 控制面板、服务入口、智能家居仪表盘和工具类应用。当界面里有许多小功能、需要让每一项都容易找到、容易信任时，它的效果最好。
在演示文稿里，把冷灰当作页面底色，在上面放白色圆角卡片作为内容容器。封面可以几乎留空，只有一个深藏青标题、一个蓝色胶囊小标签，以及一块承载图片的大圆角形状。内容页变成卡片网格，每张卡片一个短标题加一两行文字；蓝色只出现在你希望观众行动或记住的那一项上。数据页用简单的圆角柱形，以有限的蓝色渐变配合灰色作背景。
在网页界面里，把页面搭成一摞卡片和分组列表。仪表盘可以是一排服务卡片、一列由分组块组成的设置、一个设备总览——每台设备是一个气泡或一张小卡片。所有链接和按钮用系统蓝，主按钮做成胶囊形，所有不可交互的元素保持中性。导航要极简，标签清楚，当前状态克制。
在编辑与营销内容里，这种风格更友好、更干净，而不是戏剧化。落地页可以让灰色横带与圆角白色特性卡片交替，每个版块只放一个蓝色行动号召，插画用柔和、低对比的色调。产品图放在卡片上、四周留足空白效果最好。文案要短而整洁，因为这种风格是为浏览而生的，而不是为大段戏剧化的阅读。
最常见的错误是把蓝色当装饰。如果标题、图标、边框和背景淡染全是蓝色，“蓝色即可触碰”的规则就破了，界面也就失去了主要信号。第二个错误是混用圆角大小，卡片看起来互不相干，家族相似性被破坏。为卡片选一个圆角，胶囊用完全圆形，嵌套元素按一致的比例缩小。
鸿蒙 · 常见问题
为什么交互元素只用一种颜色？
这更像一条可用性规则，而不是审美规则。如果系统蓝只出现在用户可以触碰的东西上，那么在手机、手表、汽车和电视上——用户往往只扫一眼——颜色就成为可靠的信号。把它留出来，也让其他一切保持安静。代价是设计师必须克制，不把蓝色用于强调或品牌调性。
鸿蒙设计和 iOS 或 Material 设计是一回事吗？
它们有共通的思路，比如圆角卡片、清晰层级和一致的参数，但鸿蒙有自己的性格。它在色彩上更克制，在冷灰底上使用深藏青和唯一的蓝；它围绕“卡片与任务在设备间流转”这一理念组织。“超级终端”气泡视图和从图标中滑出的服务卡片，是它独有的识别点。
能做这种风格的深色模式吗？
可以，但要把它当作单独的调校工作。浅色版本依靠白色卡片浮在灰底上；深色版本需要用不同深浅的暗灰层来保持同样的层次分离，以及一种柔化后仍然清晰的蓝。保持“蓝色标记交互”这一规则，不要因为底色变深就添加额外的强调色。
这种风格里的“服务卡片”是什么？
服务卡片是一张紧凑的卡片，不必打开完整应用，就把应用的一小块功能呈现出来，比如一个快捷操作或一条实时信息。在视觉上，它是一张白色圆角卡片，有短标题、几行内容和一个胶囊形操作。在网页上，它很容易变成仪表盘和落地页里可重复使用的组件。
这种风格在哪些场景表现欠佳？
在情绪、质感或强烈品牌个性才是重点的场景里，它会显得力不从心：奢侈品、文化项目、表现力强的编辑内容。当产品除了功能之外无话可说时，它的平静与中性可能显得泛泛。它最适合那些强项在于清晰以及跨多种场景一致性的工具、服务和系统。
