2

我想以顺风风格为我的配色方案制作 SASS Mixins。

对于每种颜色，我想生成 400、300、200 和 100 等版本。

现在很高兴知道顺风步骤的百分比是多少。

我在互联网上没有发现任何关于这个问题的信息。

4

3 回答 3

1

我实际上使用https://javisperez.github.io/tailwindcolorshades/#/来生成阴影，它将输出如下内容：

  concrete: {
    100: '#FEFEFE',
    200: '#FCFCFC',
    300: '#FAFAFA',
    400: '#F6F6F6',
    500: '#F2F2F2',
    600: '#DADADA',
    700: '#919191',
    800: '#6D6D6D',
    900: '#494949',
  },

您可以将其包含在您的tailwind.config.js文件中。

于 2020-04-04T09:43:07.530 回答
0

Tailwind 的默认颜色都是精心挑选的，它们没有生成调色板的工具，因此您必须这样做。

从文档：

生成自定义调色板

我们得到的一个常见问题是“我如何生成我自己的自定义颜色的 100-900 种色调？”。

坏消息：颜色很复杂，我们还没有找到能够很好地生成这些调色板的工具。我们手动选择了 Tailwind 的所有默认颜色，并通过肉眼平衡它们。对不起！

于 2020-04-01T09:39:56.967 回答
0

我找到了这个 figma 插件：https ://www.figma.com/community/plugin/815578663120885543/Tailwind-Color-Generator

这会生成自定义调色板供您在设计中使用，然后您可以将其导出到您的 SCSS 文件中 - 结果应该是相同的。

于 2020-04-08T14:54:02.240 回答