Material Design颜色表

查询Google Material Design颜色规范,包含19色系、900级色卡,点击任意色块复制HEX值。

关于 Material Design颜色表

Material Design是Google推出的设计系统,其颜色规范包含19个主要色系,每个色系提供10级色阶(50、100、200...900),共190余种颜色。点击任意色块即可复制HEX值,便于在设计软件或代码中使用。

色阶含义

  • 50:最浅色,用作背景或hover状态。
  • 100-400:浅色调,常用于浅色主题。
  • 500:基准色,作为品牌主色。
  • 600-900:深色调,用于文本或深色主题。

使用建议

  • 500作为主色,搭配50(浅背景)和700(按钮hover)。
  • 避免相邻色系混用(如Red和Pink),易混淆。
  • 遵循WCAG对比度:正文与背景对比度不低于4.5:1。