Installing Tailwind CSS as a Vite plugin

Installing Tailwind CSS as a Vite plugin is documented as the most seamless way to integrate it with frameworks like Laravel, SvelteKit, React Router, Nuxt, and SolidJS. Create a project with npm create vite@latest if you do not have one, then install tailwindcss and @tailwindcss/vite via npm. Add the plugin to vite.config.ts: import tailwindcss from '@tailwindcss/vite' and register plugins: [tailwindcss()]. Add @import "tailwindcss"; to your CSS file, run your build process with npm run dev, and make sure the compiled CSS is included in the <head> of your page — your framework might handle that for you — then start using Tailwind's utility classes. Prefer this plugin over a PostCSS setup in new Vite projects; that preference is Koskamo editorial guidance. Scope: Tailwind CSS v4. Reviewed October 4, 2026.