Skip to content

Migrate Tailwind CSS v3 to v4#143

Merged
phmatray merged 2 commits intomainfrom
feat/tailwind-v4-migration
Feb 27, 2026
Merged

Migrate Tailwind CSS v3 to v4#143
phmatray merged 2 commits intomainfrom
feat/tailwind-v4-migration

Conversation

@phmatray
Copy link
Contributor

@phmatray phmatray commented Feb 27, 2026

Summary

  • Migrate from Tailwind CSS v3 JS-config architecture to v4 CSS-first architecture
  • Replace @tailwind directives with @import "tailwindcss" and @source for content detection
  • Move theme config from tailwind.config.js to @theme { ... } CSS custom properties
  • Convert 4 cross-referenced base classes (focus-ring, btn, nav-item, toast) to @utility so @apply works in v4
  • Switch build tooling from tailwindcss + postcss + autoprefixer to @tailwindcss/cli
  • Delete tailwind.config.js and postcss.config.js (no longer needed)
  • Remove 12 unused CSS component classes (btn-primary, btn-danger, badge-*, card-hover, file-item-selected, input-error, truncate-2)

Test plan

  • npm run build:css succeeds with no errors (Tailwind v4.2.1)
  • output.css contains custom color utilities (bg-cloud-600, text-cloud-700)
  • output.css contains component classes (.btn-ghost, .toast-success, .modal-backdrop)
  • dotnet build succeeds (0 errors)
  • CI passes on this PR
  • Visual check: app renders correctly at http://localhost:5040

Replace JS config with CSS-native @theme, @Utility, and @source directives.
Remove postcss/autoprefixer dependencies in favor of @tailwindcss/cli.
Convert cross-referenced base classes (focus-ring, btn, nav-item, toast) to
@Utility so @apply works correctly in v4. Remove 12 unused component classes.
Main reverted tailwindcss to ^3.4.0 with postcss/autoprefixer — resolve
in favor of our v4 migration (@tailwindcss/cli + tailwindcss ^4.0.0).
Regenerate package-lock.json.
@phmatray phmatray merged commit 9d7becb into main Feb 27, 2026
2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant