如何在顺风 css 中使用颜色或 css/scss 中的材质 ui答案

【问题标题】：How to use colors in tailwind css or material ui in css/scss如何在顺风 css 中使用颜色或 css/scss 中的材质 ui
【发布时间】：2021-10-08 15:33:32
【问题描述】：

我为顺风 css 和 material ui colors 找到了这个 tailwind color。这些颜色很好地命名为 100 - 900 和 A100 - 400，就像字体一样。我认为直接在 scss 或 css 文件上使用它们会很好。我该怎么做/有没有可以使用的导入文件？

【问题讨论】：

【解决方案1】：

我建议使用LESS with TailWindCSS 来受益于Mixin。

使用手写笔：

// index.styl
$codeBackground = theme('colors.pink.800')

a
 @apply text-yellow-600 !important
 background $codeBackground !important

输出：

【讨论】：

谢谢。我有几个问题。你必须在 index.styl 中导入一些东西才能使主题（'colors.pink.800'）工作吗？并且只需 npm install for less 就可以在我的常规 html/scss 中使用它？
关于手写笔我发现它在没有顺风底座的情况下在我的测试中工作；顺风组件；顺风公用事业；最后我还没有测试过。见[少] (tailwindcss.com/docs/using-with-preprocessors#less)
我现在没有时间尝试它是否有效..但感谢您的努力回答
不要忘记检查答案作为解决方案。

【解决方案2】：

首先在下拉列表中选择rgb -

然后单击您想要的任何颜色。它的 rgb 代码将被复制。然后在您的 css 文件中的任何位置使用它，而无需任何麻烦前 - 颜色：rgb(146, 64, 14)，背景颜色：rgb(146, 64, 14) 等。

【讨论】：

【解决方案3】：

我不确定你想做什么。您可以参考标记中的颜色类，例如..

bg-blue-400 或 text-red-800

【讨论】：