Error: 'colors.danger.400' does not exist in theme config when configuring Tailus UI with Vite

[eMUQI]

Describe the bug

Hello, I'm a front-end beginner. I followed this tutorial to configure Tailus UI: https://ui.tailus.io/react/guides/vite/

However, I encountered the following error. Did I miss something?

Thank you for your assistance!

[plugin:vite:css] [postcss] D:/DEV/podcast/my-project/src/index.css:1:1: 'colors.danger.400' does not exist in your theme config. 'colors' has the following keys: 'inherit', 'current', 'transparent', 'black', 'white', 'slate', 'gray', 'zinc', 'neutral', 'stone', 'red', 'orange', 'amber', 'yellow', 'lime', 'green', 'emerald', 'teal', 'cyan', 'sky', 'blue', 'indigo', 'violet', 'purple', 'fuchsia', 'pink', 'rose'
D:/DEV/podcast/my-project/src/index.css:1:0
1  |  @tailwind base;
   |  ^
2  |  @tailwind components;
3  |  @tailwind utilities;

To Reproduce Steps to reproduce the behavior:

1. Create a new Vite project

npm create vite@latest my-project -- --template react
cd my-project

2. Install Tailwind CSS

npm install -D tailwindcss postcss autoprefixer
npx tailwindcss init -p

3. Install Tailus UI Themer

npm install @tailus/themer tailwind-merge lucide-react

4. Update Tailwind CSS configuration

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    './index.html',
    './src/**/*.{js,ts,jsx,tsx}',
    './node_modules/@tailus/themer/dist/components/**/*.{js,ts}',
  ],
  theme: {
    extend: {},
  },
  plugins: [],
}

5. Add css directives

// index.css

@tailwind base;
@tailwind components;
@tailwind utilities;

6. Add cloneElement utility
7. npm run dev

Expected behavior Without any error

Screenshots If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

• OS: Windows
• Browser chrome
• Version [e.g. 22]

Additional context Add any other context about the problem here.