Tailwind 文档中给出的默认颜色不起作用

Question

我尝试使用文档中提到的琥珀色和石灰色等颜色。这些颜色不起作用。只有具有原色名称（例如红色、粉色）等名称的颜色才有效。

无效的颜色：琥珀色、翠绿色、石灰色、玫瑰色、紫红色、板岩色、锌色，甚至橙色。

我使用的是 2.26 版本，但我使用 Tailwind Playground 检查了 1.9 到 2.25 之间的版本，但这些颜色仍然不起作用。即使在操场上，也不建议使用这些颜色名称。

为什么我不能使用这些颜色？

Answer 1

这是 Tailwind版本 3的文档，它扩展了调色板。

您需要更新到版本 3 或使用版本 2 文档并手动扩展调色板，如下所示：

// tailwind.config.js
const colors = require('tailwindcss/colors')

module.exports = {
  theme: {
    extend: {
      colors: {
        // you can either spread `colors` to apply all the colors
        ...colors,
        // or add them one by one and name whatever you want
        amber: colors.amber,
        emerald: colors.emerald,
      }
    }
  }
}

有关 v2 颜色定制的更多信息

调色板参考 v2

因此，如果您想配置调色板，请阅读此 v2 文档。

Answer 2

尝试这个：

const colors = require('tailwindcss/colors')

module.exports = {
    theme: {
        extend: {
            colors: {
                   //just add this below and your all other tailwind colors willwork
                ...colors
            }
        }
    }
}