Tailwind.config.js新增自定义颜色无法生效问题求助

在给tailwind.config.js添加新自定义颜色时遇到异常：之前添加的自定义颜色（如bg-primary-orange）能正常使用，但新增的bg-hero-inactive等颜色无法生效。已尝试修改颜色名称、重建应用，问题仍未解决。

用户提供的tailwind.config.js配置如下：

// /** @type {import('tailwindcss').Config} */
module.exports = {
    content: ['./src/**/*.{js,jsx,ts,tsx}', 'node_modules/flowbite-react/**/*.{js,jsx,ts,tsx}'],
    theme: {
        
        extend: {
            backgroundImage: {
                'gallery-1': "url('/gallery/gallery-1.jpeg')",
                'gallery-2': "url('/gallery/gallery-2.jpeg')",
                'gallery-3': "url('/gallery/gallery-3.jpeg')",
                'gallery-4': "url('/gallery/gallery-4.jpeg')",
                'gallery-5': "url('/gallery/gallery-5.jpeg')",
                'gallery-gradient':
                    'background-image: linear-gradient(180deg, rgba(17, 25, 40, 0) 26.56%, rgba(17, 25, 40, 0.75) 100%);',
            },
            colors: {
                'primary-orange': '#FAAE2B',
                'offer-hov': '#E6EBE9',
                'stat-col': 'rgba(1, 71, 55, 0.05)',
                'custom-light': 'rgba(1, 71, 55, 0.05)',
                'separator': 'rgba(1, 71, 55, 0.1)',
                'icon': 'rgba(222, 247, 236, 0.6)',
                'advantage-number': 'rgba(4, 108, 78, 0.5)›',
                'hero-inactive': 'rgba(1, 71, 55, 0.3)›',
            },
            spacing: {
                hero: '4.625rem', // following the standard of 128 / 4 = 32
            },
            flexBasis: {
                '1/7': '14.2857143%',
                '2/7': '28.5714286%',
                '3/7': '42.8571429%',
                '4/7': '57.1428571%',
                '5/7': '71.4285714%',
                '6/7': '85.7142857%',
            },
            animation: {
                'bounce-one': 'bounce .7s linear',
                scroll: 'scroll 40s linear infinite',
            },
            keyframes: {
                scroll: {
                    '0%': { transform: 'translateX(0)' },
                    '100%': { transform: 'translateX(calc(-64px * 14))' },
                },
            },
        },
    },
    plugins: [require('flowbite/plugin')],
}

检查配置中的colors字段可以发现，advantage-number和hero-inactive的颜色值末尾多了一个特殊字符›，这会导致Tailwind无法正确解析颜色值，进而无法生成对应的CSS工具类。

将这两个颜色值末尾的特殊字符删除，修正后的colors配置如下：

colors: {
    'primary-orange': '#FAAE2B',
    'offer-hov': '#E6EBE9',
    'stat-col': 'rgba(1, 71, 55, 0.05)',
    'custom-light': 'rgba(1, 71, 55, 0.05)',
    'separator': 'rgba(1, 71, 55, 0.1)',
    'icon': 'rgba(222, 247, 236, 0.6)',
    'advantage-number': 'rgba(4, 108, 78, 0.5)',
    'hero-inactive': 'rgba(1, 71, 55, 0.3)',
},

修正完成后，重启开发服务或重新构建项目，新增的颜色类即可正常生效。

内容的提问来源于stack exchange，提问作者Setho