[bug]: Shadcn not validating Tailwind CSS installation after Tailwind 4 update

[Ranbir5ingh]

Describe the bug

After the update to Tailwind CSS 4, the npx shadcn@latest init command fails to validate the Tailwind CSS installation due to the removal of the Tailwind config file. This prevents the proper initialization of Shadcn. It is recommended to update the installation documentation to reflect these changes.

Affected component/components

N/A (This issue affects the initialization process rather than specific components)

How to reproduce

1. Update Tailwind CSS to version 4.
2. Run the command npx shadcn@latest init.
3. Observe that the command fails to validate the Tailwind CSS installation.

Codesandbox/StackBlitz link

No response

Logs

✔ Preflight checks.
✔ Verifying framework. Found Vite.
✖ Validating Tailwind CSS.
✖ Validating import alias.

No Tailwind CSS configuration found at C:\Users\ranbi\OneDrive\Desktop\Portfolio website\client.
It is likely you do not have Tailwind CSS installed or have an invalid configuration.
Install Tailwind CSS then try again.
Visit https://tailwindcss.com/docs/guides/vite to get started.

No import alias found in your tsconfig.json file.
Visit https://ui.shadcn.com/docs/installation/vite to learn how to set an import alias.

System Info

- Operating System: Windows 11
- Node.js version: (v22.12.0)
- NPM version: (10.9.0)

Before submitting

• I've made research efforts and searched the documentation
• I've searched for existing issues

[brrock]

This is urgent @shadcn

[Richi2293]

Hi,

same issue for me!

macos 15.2
node v23.5.0
npm 11.0.0

[sharath-ops]

use this cmd

npm install -D tailwindcss@3.4.0 postcss autoprefixer

mention (@3.4.0)

[sharath-ops]

if you are using js
make sure adding jsconfig file in root folder with this content

{
"compilerOptions": {
"baseUrl": ".",
"paths": {
"@/": ["./src/"]
}
}
}

[Ranbir5ingh]

use this cmd

npm install -D tailwindcss@3.4.0 postcss autoprefixer

mention (@3.4.0)

Yes It works, but it will not solve the issue with tailwind 4

[andreibadescu]

same issue

[lloydrichards]

Just to be clear, this is just an issue with init and components that change the tailwind config (accordion, sidebar). You can quite easily have tailwind v4 running, create a tailwind.config.ts, and then run npx shadcn@latest init. Afterwards you will need to update the tailwind theme in global.css the way tailwind v4 now defines the config or add the config using @config "../../tailwind.config.js";

Check out the example repo for how the global.css should be setup: https://github.com/shadcn/app-tailwind-v4

[obada-jaras]

same here

[bilalsadiq03]

if you are using js make sure adding jsconfig file in root folder with this content

{ "compilerOptions": { "baseUrl": ".", "paths": { "@/": ["./src/"] } } }

it only debugs the import alias issue that is:
No import alias found in your tsconfig.json file.
Visit https://ui.shadcn.com/docs/installation/vite to learn how to set an import alias.

but the main issue is with the tailwind configuration.

[brrock]

I think a quick update is needed

[bilalsadiq03]

@shadcn urgently sort out this issue

[farhanf-rafi]

@shadcn update the issue

[DestroyCom]

I'm a subscriber to the issue, so I can read all the messages, with all due respect, but the people who are screaming to fix this urgently, why don't you do your own fork/PR?
That's the point of an opensource project, we're already lucky enough to have a community pushing this project to the max, I'm sure they're already looking at the problem, there's no point in pressing them anymore/disturbing them....

Give them time to fix the problem, don't forget that for most of them this is a project in addition to their main job.