TailwindCSS v3
The installation of TailwindCSS v3 and v4 is different. You were expecting the v3 installation, but v4 is the new latest version. For v3 installation, use:
npm install -D tailwindcss@3
TailwindCSS v4
However, if you want to install v4, I recommend reviewing the installation guides, as there are significant breaking changes between v3 and v4.
npm install tailwindcss @tailwindcss/vite
Starting from v4, there is no need for an init process, as it has been completely removed. The npx tailwindcss command is also no longer required, as it has been separated into a dedicated @tailwindcss/cli package.
For Vite, a dedicated @tailwindcss/vite plugin has been created, while compatibility with PostCSS is ensured by the @tailwindcss/postcss plugin.
There is no need for Autoprefixer or PostCSS. V4 is built on a completely new engine, LightningCSS, and as a result, it no longer supports Sass, Less, or Stylus preprocessors.
v4 is designed for the long term, which is why the minimum browser requirements have been significantly increased. This is primarily justified by the use of great CSS features that have been available for a few years, such as oklch(), color-mix(), @property, and others. Check the minimum requirements here: TailwindCSS v4 Browser Support
Starting from v4, a CSS-first configuration is applied by default. However, it is possible to revert to the legacy JavaScript-based configuration using the @config directive. Because of this, a tailwind.config.js file is no longer required by default.
