title: tailwind certain custom color not taking effect in laravel 8 welcome page
body: <p>I am trying to add a custom color to tailwind.config.js and use it as a background or text color but it is not taking effect. What is odd is I have added other custom color before into tailwind config, those are working fine only anything new that I try to add does not work.
  Here is my tailwind.config.js</p>
  <pre><code>const defaultTheme = require('tailwindcss/defaultTheme');
  
  module.exports = {
  
  theme: {
     extend: {
          colors:{
              salmon: {
                  th1: '#B03060',    
              },
              tuna: {
                  th1: '#393B3E',    
              },
              wildblueyonder: {
                  th1: '#768DAE',
              },
              xanadu: {
                  th1: '#798578',
              },
              napa: {
                  th1: '#AC9F8F',
              },    
              cararra: {
                  th1: '#F6F7F4',    
              },
              kimberly: {
                  th2: '#7A81A8',
              },
              shakespeare: {
                  th2: '#53A7CE',
              },
              jordyblue: {
                  th2: '#8CCBF3',
              },
              softpeach: {
                  th2: '#FAF7F6',
              },
              softr: {
                  th2: '#FAF7F6',    
              },
          },
          fontFamily: {
              sans: ['Nunito', ...defaultTheme.fontFamily.sans],
          },
      },
  },
  variants: {
      extend: {
          opacity: ['disabled'],
      },
  },
  
  plugins: [require('@tailwindcss/forms')],
  };
  </code></pre>
  <p>Here is my view blade file code where I am using the color(text-salmon-th1) for text in the login a href tag.</p>
  <pre><code> &lt;div class=&quot;flex lg:justify-center&quot;&gt;
                  &lt;label class=&quot;bg-tuna-th1&quot;&gt;test&lt;/label&gt;
                  &lt;a href=&quot;{{ route('login') }}&quot;
                      class=&quot;inline-flex px-6 py-2 text-2xl font-semibold text-salmon-th1 transition duration-500 ease-in-out transform rounded-lg hover:bg-red-700 hover:to-red focus:shadow-outline focus:outline-none focus:ring-2 ring-offset-current ring-offset-2&quot;&gt;@lang(&quot;Login&quot;)&lt;/a&gt;
                  &lt;a href=&quot;{{ route('register') }}&quot;
                      class=&quot;inline-flex items-center text-2xl px-6 py-2 ml-4 font-semibold text-white transition duration-500 ease-in-out transform bg-red-800 rounded-lg shadow-xl hover:to-red hover:bg-red-700 hover:text-white focus:shadow-outline focus:outline-none focus:ring-2 ring-offset-current ring-offset-2&quot;&gt;@lang(&quot;Register&quot;)&lt;/a&gt;
              &lt;/div&gt;
  </code></pre>
  <p>I have tried clearing the cache of browser, clearing laravel view cache.
  Every time I change something in the tailwind config file I have tried &quot;npm run watch&quot; or &quot;npm run dev&quot;.
  And I know tailwindcss is included in page because the other colors tuna, wildblueyonder e.t.c work only the new ones that I am adding including &quot;salmon&quot; does not work.</p>
  <p>I have exhausted searching the reason for this.. .Any help will be greatly appreciated.</p>