● 在线
Material Design

Material Design

谷歌开源设计系统,用于跨平台一致、直观界面

产品介绍

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
ASSETS_DIRECTORY
/// 相似工具