创建自定义角度材质主题时最好的方法是什么？

Question

我正在尝试了解如何最好地使用 Angular 材质主题：

Google 提供了广泛的color palettes， 并且还提供了如何easily switch between palettes的指南。

我看到了这个question，并找到了一堆工具来围绕主要颜色生成调色板（tool1，tool2）

虽然从设计师那里获得定制设计时，选择了不同的颜色，但我发现很难将设计颜色实现为一个完整的主题，因为要考虑的变量太多（例如悬停阴影、墨水波纹阴影等）。

我的问题是：

1. 作为开发人员，我能否从 交付给我的每个设计（通过 JS 主题化或 CSS 覆盖），还是需要考虑任何限制？

2. 设计者是否应该考虑一些指导方针？ 创建设计？

3. 我们是否应该放弃设计的灵活性，采用以下方法之一 Google 的预定义调色板？

**

编辑 - 05/2017：

我决定完全关闭主题，因为我无法完全理解如何根据我们的需要自定义它。

我现在通过 webpack 将变量注入到 SASS 文件中，并且输出代码更加健全。

**

Answer 1

1. 不，目前没有。 “令人愉悦”是一个广义的、基于意见的术语，不是由逻辑算法决定的。实际上，在我终于了解了足够多的 UI 设计知识并知道它行不通之前，我实际上已经尝试这样做了几个月。

2. Google 的材料设计指南是设计师创建材料主题所需的全部内容。时间不长，一般设计师一个小时左右就能看完。

3. 没有。 Google 的预定义调色板旨在供程序员使用，以快速创建具有可接受界面的站点。除非您专门为 Google 工作，否则没有理由限制设计师的调色板。不过，它们完全可以作为指导方针。请参阅Dark Material UI，这是一个基于 Material Design 的设计概念，但不遵守许多指南（例如，它使用 Google 调色板中未包含的颜色）

Answer 2

我们使用的方法只是在您的html head 部分中更改css 文件的href。在这种情况下，每个主题都有独立的 css 文件，当需要切换时，只需修改 href。

不需要像谷歌推荐的那样使用额外的标记，因为在主题之间切换会很复杂，特别是如果有很多主题。

您可以在此处查看示例： http://docs.telerik.com/kendo-ui/styles-and-layout/how-to/change-themes-on-the-client

有一个活生生的例子。以及材料主题。