UD5工具箱
Q：什么是Material Design色板？它和其他色板有什么区别？
A：Material Design色板是谷歌Material Design设计语言中定义的标准化色彩体系，其最大特点是每种主色都包含从50到900的十个色阶，以及A100到A700四个强调色色阶。与传统色板（如Web安全色、Pantone色卡等）相比，Material Design色板更专注于数字界面设计场景，其色阶体系专为构建视觉层级而设计，50色阶适合背景、500色阶适合主色、900色阶适合文字，形成了系统化的设计色彩解决方案。
Q：色阶编号50-900的含义是什么？如何选择？
A：色阶编号反映了同一色相下颜色的明度变化，编号越大颜色越深。具体推荐用途如下：50-100用于页面背景、卡片背景或表格条纹色，颜色非常浅淡；200-300用于次要背景或禁用状态，较浅但仍有一定色彩；400-500用于主色（Primary Color），是品牌色和界面主色调的首选；600-700用于主色的深色变体，适合导航栏、按钮悬浮态；800-900用于标题文字、深色背景或强调性的视觉元素。在具体项目中，建议将500色阶定义为主色，50/100色阶作为背景色，700/800色阶作为文字颜色。
Q：A100-A700强调色有什么用？如何与主色搭配？
A：强调色（Accent Color）是Material Design色彩体系中用于突出交互元素的高饱和度颜色。A100饱和度最低但明度最高，适合轻量级的强调；A200和A400饱和度适中，适合按钮和链接的常规状态；A700明度最深，适合深色背景上的强调元素。搭配原则为主色决定整体视觉基调，强调色用于需要吸引用户注意力的交互元素。常见的搭配方案包括：蓝色主色配橙色强调色（冷静与活力）、绿色主色配黄色强调色（自然与明亮）、紫色主色配粉色强调色（优雅与浪漫）。
Q：本工具是否免费？是否可以商用？
A：本工具完全免费使用，无需注册、无需付费、无使用次数限制。Material Design色彩规范本身由谷歌以开源方式发布，任何人都可以免费用于商业项目。您从本工具中获取的任何色值均可自由用于商业设计、网站开发、移动应用开发等场景，无需标注来源或支付授权费用。但请注意，本工具本身仅提供色值查阅功能，不提供与色值相关的品牌商标授权。
Q：如何在项目中使用Material Design色板？
A：在Web项目中使用的方法包括：在CSS中直接使用HEX色值（如color: #2196F3;）、定义CSS变量进行统一管理（如--md-blue: #2196F3;）、使用预处理器变量（Sass/Less变量）、导入现成的Material Design色彩库（如material-colors npm包）。在UI框架中，Vuetify通过theme选项配置主色和强调色，Material-UI通过createTheme配置palette，Angular Material通过主题配置文件设置primary和accent色值。在设计工具中，可以将色值导入Figma或Sketch的颜色样式库，建立团队共享的设计系统色板。
Q：为什么复制后的色值粘贴出来不一样？
A：这通常不是工具的问题，而是操作系统或软件之间的色域差异导致的。HEX色值本身是确定的数字编码（如#F44336在任何地方代表的都是RGB(244,67,54)），但不同设备屏幕的色域覆盖范围不同（如sRGB、Adobe RGB、DCI-P3），不同软件的颜色管理配置也不同，因此同一色值在不同设备或软件中显示时可能存在肉眼可见的色差。建议在目标软件中进行颜色校准，或使用色彩管理一致的设计工作流。
Q：色板中有棕色和灰色系，它们也是Material Design的官方定义吗？
A：是的，棕色（Brown）和灰色（Grey/Gray）以及蓝灰色（Blue Grey）都是Material Design官方色彩规范中的组成部分。其中灰色系只有色阶50-900（没有A系列强调色），因为在灰色上叠加高饱和度的强调色难以产生理想的视觉效果。棕色和蓝灰色同样属于中性色系，在设计中通常被用作辅助色、背景色或替代黑色的深色文字色。蓝灰色结合了蓝色的冷静和灰色的中性，是一套非常实用的中性色选择，尤其适合科技产品的界面设计。
Q：A400为什么看起来比其他强调色更鲜艳？
A：A400是强调色四个色阶中饱和度最高、最鲜艳的一个，这是Material Design的刻意设计。A400被设计为在最需要吸引用户注意力的场景中使用，例如主要行动按钮（CTA按钮）、重要通知图标、活动促销标签等。在Material Design规范中，A400的色值往往处于该色系饱和度曲线的峰值位置。因此在使用时应当克制，仅在需要强烈视觉提示的元素上使用A400，避免过度使用造成视觉疲劳。