产品介绍
Material Design 是谷歌全面开源设计系统,用于创建美丽、一致和可访问的用户体验,覆盖 Web、移动和其他平台。最初于 2014 年推出并持续演进(最新 Material Design 3),它借鉴纸张和墨水的原则——如高程、阴影、运动和材质表面——指导直观交互。不仅用于谷歌产品(如 Android 应用),还广泛采用于 Web(Material Web Components)等,强调适应性主题、响应式布局和可访问性。 组件:可重用 UI 元素如按钮、卡片、导航抽屉、对话框和芯片,支持状态和主题变体。 设计令牌:颜色(基准、动态方案)、排版、形状、高程和运动指南。 Material Theme Builder:自定义调色板和生成主题工具。 实现:Material Web(Web)、Material UI(React)、Angular Material、Flutter Material 和 Android Jetpack Compose。 可访问性:符合 WCAG、高对比模式和包容模式。
适用人群
适合构建可扩展、一致数字产品的团队。
核心功能
- 组件:可重用 UI 元素如按钮、卡片、导航抽屉、对话框和芯片,支持状态和主题变体。
- 设计令牌:颜色(基准、动态方案)、排版、形状、高程和运动指南。
- Material Theme Builder:自定义调色板和生成主题工具。
- 实现:Material Web(Web)、Material UI(React)、Angular Material、Flutter Material 和 Android Jetpack Compose。
- 可访问性:符合 WCAG、高对比模式和包容模式。
优点
- +开源
- +调色板生成
- +无障碍对比度检查
- +流畅的动画功能
缺点
- -采用需要团队协调
- -自定义可能较复杂
/// 规格参数
- 价格:Free
- 平台:Browser / Android

Horizon Design System
HashiCorp 开源设计系统,用于云管理界面一致可访问设计。

Forma 36 Design System
Contentful 开源设计系统,用于一致、可访问的内容管理界面。

Friday Design System
开源 Figma UI 套件,支持快速原型和自定义组件。

GOV.UK Design System
英国政府官方框架,用于公共服务一致、可访问界面。

Microsoft Teams UI Kit
Figma 组件和模板,用于设计一致 Teams 应用。

Figma UI2
Figma 官方设计系统,用于产品界面一致可访问设计。

Moon Design System
开源 UI 框架,用于一致、可自定义数字体验。

NativeBase Design System
开源 React Native UI 组件库,支持可自定义跨平台可访问设计。

gluestack-ui
开源通用 React UI 库,支持 Web 和 Native 应用的可自定义可访问组件。

Goldman Sachs Design System
内部框架,用于金融企业界面一致可访问设计。
