How to use the tailwindcss/defaultConfig.js.theme function in tailwindcss

blue: { // experimental, could merge with brand
          '100': 'hsl(208, 79%, 92%)',
          '200': 'hsl(208, 97%, 85%)',
          '300': 'hsl(208, 84%, 74%)',
          '400': 'hsl(208, 74%, 65%)',
          '500': 'hsl(208, 65%, 55%)',
          '600': 'hsl(208, 67%, 45%)',
          '700': 'hsl(208, 76%, 39%)',
          '800': 'hsl(208, 82%, 33%)',
          '900': 'hsl(208, 87%, 29%)',
          '999': 'hsl(208, 100%, 21%)',
        }
      },
      textColor: {
        primary: 'hsl(208, 93%, 44%)',
        danger: defaults.theme.colors.red[700],
      },
      borderColor: {
        danger: defaults.theme.colors.red[700],
      },
      backgroundColor: {
        'primary-alpha': 'hsla(208, 87%, 50%, 87%)',
        'blue-700-alpha': 'hsla(208, 76%, 39%, 75%)',
      },
      inset: {
        '1/2': '50%',
      },
      opacity: {
        '1': '0.01',
      },
      spacing: {
        auto: 'auto',

'300': 'hsl(208, 84%, 74%)',
          '400': 'hsl(208, 74%, 65%)',
          '500': 'hsl(208, 65%, 55%)',
          '600': 'hsl(208, 67%, 45%)',
          '700': 'hsl(208, 76%, 39%)',
          '800': 'hsl(208, 82%, 33%)',
          '900': 'hsl(208, 87%, 29%)',
          '999': 'hsl(208, 100%, 21%)',
        }
      },
      textColor: {
        primary: 'hsl(208, 93%, 44%)',
        danger: defaults.theme.colors.red[700],
      },
      borderColor: {
        danger: defaults.theme.colors.red[700],
      },
      backgroundColor: {
        'primary-alpha': 'hsla(208, 87%, 50%, 87%)',
        'blue-700-alpha': 'hsla(208, 76%, 39%, 75%)',
      },
      inset: {
        '1/2': '50%',
      },
      opacity: {
        '1': '0.01',
      },
      spacing: {
        auto: 'auto',
        '9': '2.25rem', // 1.5 * 24px/1.5rem
        '18': '4.5rem', // 3 * 24px/1.5rem
        '66': '16.5rem', // 11 * 24px/1.5rem