如何在自定义 css 类中使用 tailwindcss 颜色？

Question

我可以使用预定义的 tailwind 类在 HTML 中设置颜色，例如：

<div class="border border-purple-500"></div>

但我也想在我的自定义 css 中使用相同的颜色，例如：

.my-class {
    border: 1px solid $purple-500;
}

是否可以在 CSS 中获取顺风颜色值？

Answer 1

是的。您可以使用 theme() directive。

.my-class {
    border: 1px solid theme('colors.purple.500');
}

或通过@apply

.my-class {
    @apply border border-purple-500;
}