Skip to content

v1.1.0 — TailwindCSS v3 + v4 Version Support

Choose a tag to compare

@msonowal msonowal released this 12 Feb 19:29
· 2 commits to main since this release
64d40e4

TailwindCSS v3 + v4 Version Support

Every tool now accepts an optional version parameter ("v3" or "v4", defaults to "v4") so users get accurate, version-specific guidance.

What's new

  • Version-aware tools — All 8 tools accept version: "v3" or version: "v4" (default)
  • Centralized version config — All v3/v4 differences live in a single module (src/version/)
  • Accurate install guides — v3 generates tailwind.config.js + autoprefixer; v4 generates @import "tailwindcss" + @tailwindcss/postcss
  • Version-aware docs — Searches hit v3.tailwindcss.com or tailwindcss.com based on version
  • v4 utility renamesconvert_css_to_tailwind auto-applies v4 renames (e.g. flex-shrinkshrink)
  • Version-aware palettesgenerate_color_palette outputs JS config for v3, CSS @theme {} for v4
  • Proper MCP logging — Fixed console.logconsole.error so debug output doesn't corrupt the stdio transport

Version differences at a glance

Feature v3 v4
CSS entry @tailwind base/components/utilities @import "tailwindcss"
Config file tailwind.config.js (required) Not needed (CSS-first)
PostCSS plugin tailwindcss + autoprefixer @tailwindcss/postcss
Dependencies tailwindcss autoprefixer postcss tailwindcss @tailwindcss/postcss
Customization JS config theme.extend CSS @theme { } block
Docs URL v3.tailwindcss.com tailwindcss.com

Example usage

// v4 (default)
install_tailwind({ framework: "react" })

// v3
install_tailwind({ framework: "react", version: "v3" })

// Works on all tools
search_tailwind_docs({ query: "dark mode", version: "v4" })
generate_color_palette({ baseColor: "#6366F1", name: "brand", version: "v3" })

Stats

  • 281 tests passing across 10 test files
  • 18 files changed, 884 insertions, 300 deletions

Full Changelog: v1.0.0...v1.1.0