Service Card
服务卡片 / 原子化万能卡片
鸿蒙 HarmonyOS 的核心特色交互载体——将应用的关键信息与高频服务外显至桌面，无需打开 App 即可一触即达。
Live Demo
真的可以点25°
多云转晴 · 深圳
你刚才看到的这个：华为手机桌面上常驻的「待办备忘录」或「实时天气」磁贴，无需点进 App 就能实时打钩完成事项或切换城市。
它到底是什么
Service Card（服务卡片 / 万能卡片）是 HarmonyOS ArkUI 生态中最具标志性的微界面范式。它打破了传统 App 孤岛，将最核心的内容与状态（如实时打车轨迹、快递动态、航班值机、音乐播放控制、健康步数）按 2x2、2x4、4x4 等标准栅格提炼为常驻桌面微视窗。用户不仅能实时通览信息流，还可以直接在卡片上完成播放/暂停、一键打卡等快捷操作，或者点击直接拉起轻量原子化服务。
Anatomy · 它由什么组成
Card Container微卡片容器
标准栅格尺寸（如 2x2: 150x150, 2x4: 310x150），圆角 16-24px
Header / Brand服务标识区
左上角应用微图标与卡片名称
Key Visual / Data核心指标与状态
大字态、动态折线图或核心进度
Quick Action一键动作触发
胶囊按钮或微按钮，支持表单提交与能力拉起
When to Use
什么时候该用 / 不该用| 情况 | 推荐 |
|---|---|
| 应用有高时效性或高频次的状态需要被用户持续感知（如外卖骑手进度、股票走势、日程提醒） | 用 |
| 提供极简的单步高频操作（如播放暂停音乐、智能家居开关、一键签到） | 用 |
| 希望通过桌面原子化服务入口为应用提供直达引流 | 用 |
| 卡片内塞入过于复杂的长列表或多步嵌套表单（应拉起完整 App） | 不用 |
不要把服务卡片当成迷你浏览器或微型 App，卡片面积有限，信息必须高度提炼、克制呈现。
避免在桌面卡片中设计复杂的滚动列表或多级导航跳转，这会大幅劣化桌面滑动体验。
Similar Patterns
别搞混Service Card当前
服务卡片 / 原子化万能卡片
鸿蒙 HarmonyOS 的核心特色交互载体——将应用的关键信息与高频服务外显至桌面，无需打开 App 即可一触即达。
Stat Card
统计卡片
一个只装一个数字的小卡片，配上标签和变化趋势。
一句话区分：鸿蒙 HarmonyOS 的核心特色交互载体——将应用的关键信息与高频服务外显至桌面，无需打开 App 即可一触即达。
怎么告诉 AI
三层 Prompt补上组件名和具体内容
实现一个 HarmonyOS 规范的 2x2 天气服务卡片：支持常驻桌面展示，显示当前气温、天气图标与空气质量，点击卡片直接拉起原子化服务，提供一键刷新交互。
不要只对 AI 说
Bad → Better不要这样对 AI 说
画一个桌面小组件。
改成这样说
遵循 HarmonyOS ArkUI 服务卡片规范：适配 2x2 栅格尺寸与圆角曲线，外显关键数据与微操作，支持一键触达原子化落地页。
分享这张卡
社交平台友好把这个 Pattern 做成 3:4（小红书）或 1:1（X / Reddit）的知识卡片，在浏览器里直接导出 PNG，不需要后端。