title: Tailwind V3 causing TypeError: Cannot read property '500' of undefined
body: <p>I recently tried to upgrade my project to tailwind css and I'm getting this error</p>
  <p><a href="https://i.stack.imgur.com/cR5YU.png" rel="noreferrer"><img src="https://i.stack.imgur.com/cR5YU.png" alt="Console Error" /></a></p>
  <p>this is my tailwind config</p>
  <pre><code> module.exports = {
        mode: &quot;jit&quot;,
        purge: [&quot;./pages/**/*.{js,ts,jsx,tsx}&quot;, &quot;./components/**/*.{js,ts,jsx,tsx}&quot;],
        darkMode: &quot;class&quot;, // or 'media' or 'class'
        theme: {
          extend: {
            colors: {
              secondaryDark: &quot;#171A1A&quot;,
              primaryDark: &quot;#090A0A&quot;,
              neonOrange: &quot;#FF9933&quot;,
              redditRed: &quot;#FF5700&quot;,
              cardGradientPrimary: &quot;#ff930f&quot;,
              cardGradientSecondary: &quot;#fff95b&quot;,
            },
          },
        },
        variants: {
          extend: {},
        },
        plugins: [require(&quot;@tailwindcss/forms&quot;)],
      };
  </code></pre>