This is a common issue when migrating from Tailwind v3 to v4 — the architecture changed significantly. Here's how to fix it with Vike:

1. Install the v4 Vite plugin

Tailwind v4 has a dedicated Vite plugin (recommended for all Vite-based projects like Vike):

npm install tailwindcss @tailwindcss/vite

Remove old v3 PostCSS packages if you have them: autoprefixer, postcss, postcss-import — v4 handles these internally.

2. Update vite.config.ts

import { defineConfig } from "vite";
import tailwindcss from "@tailwindcss/vite";
import vike from "vike/plugin";

export default defineConfig({
  plugins: [
    tailwindcss(),
    vike(),
  ],
});

Remove any postcss.config.js or PostCSS config from your Vite config — the Vite plugin handles everything.

3. Update your CSS entry file

Replace the old v3 directives:

/* OLD v3 — remove these */
@tailwind base;
@tailwind components;
@tailwind utilities;

With:

/* NEW v4 */
@import "tailwindcss";

4. Add @source directives if needed

Tailwind v4 auto-detects classes through the Vite module graph instead of the old content array. If Vike's file structure puts templates in directories that aren't naturally part of the module graph, Tailwind won't find your classes (including responsive variants like md:, lg:, etc.).

Add explicit source paths in your CSS:

@import "tailwindcss";
@source "../pages/**/*.{js,ts,jsx,tsx,vue}";
@source "../components/**/*.{js,ts,jsx,tsx,vue}";

5. Delete tailwind.config.js

The old config file is no longer needed. If you had custom breakpoints, migrate them to the @theme directive:

@import "tailwindcss";

@theme {
  --breakpoint-sm: 640px;
  --breakpoint-md: 768px;
  --breakpoint-lg: 1024px;
  --breakpoint-xl: 1280px;
  --breakpoint-2xl: 1536px;
}

(These are the defaults — you only need @theme if you customized them.)

6. Verify viewport meta tag

Make sure your HTML head includes:

<meta name="viewport" content="width=device-width, initial-scale=1.0" />

Without this, media queries (which power responsive breakpoints) won't work correctly.

The migration guide has more details: https://tailwindcss.com/docs/upgrade-guide