Track the Tailwind 3 → 4 migration.
Spec: docs/superpowers/specs/2026-05-28-tailwind-4-migration-design.md
TL;DR
Tailwind 4 is a major architectural rewrite (CSS-first config, new @tailwindcss/postcss, dropped/renamed utilities). CI was green on the dependabot PR (#110) but misleadingly so — CI doesn't build the playground, which is the only thing using Tailwind. The library itself ships no CSS to consumers, so this is contained to dev tooling.
Scope (6 files, all dev-only)
tailwind.config.ts (root) — delete (not in published files, was aspirational).
playground/tailwind.config.js — replaced by Tailwind 4's CSS-first config.
playground/postcss.config.js — switch to @tailwindcss/postcss, drop autoprefixer (now bundled).
playground/src/index.css — replace 3× @tailwind directives with @import "tailwindcss";.
package.json (root devDeps) — bump tailwind, add @tailwindcss/postcss, drop standalone autoprefixer.
- Codemod for renamed utilities (
bg-opacity-*, flex-grow-*, etc.) in playground/src/*.tsx.
Verification
The /#gallery view from #88 is the canonical visual-diff reference — every chart in every vibe, every brand kit, every texture tier on one page. Spot-check it before and after; CI lib/mcp gates are unaffected.
See spec for the phased plan, full codemod target list, and risks.
(Closes-out point for the dependabot PR #110, which is being closed as superseded by this tracking issue.)
Track the Tailwind 3 → 4 migration.
Spec:
docs/superpowers/specs/2026-05-28-tailwind-4-migration-design.mdTL;DR
Tailwind 4 is a major architectural rewrite (CSS-first config, new
@tailwindcss/postcss, dropped/renamed utilities). CI was green on the dependabot PR (#110) but misleadingly so — CI doesn't build the playground, which is the only thing using Tailwind. The library itself ships no CSS to consumers, so this is contained to dev tooling.Scope (6 files, all dev-only)
tailwind.config.ts(root) — delete (not in publishedfiles, was aspirational).playground/tailwind.config.js— replaced by Tailwind 4's CSS-first config.playground/postcss.config.js— switch to@tailwindcss/postcss, dropautoprefixer(now bundled).playground/src/index.css— replace 3×@tailwinddirectives with@import "tailwindcss";.package.json(root devDeps) — bump tailwind, add@tailwindcss/postcss, drop standaloneautoprefixer.bg-opacity-*,flex-grow-*, etc.) inplayground/src/*.tsx.Verification
The
/#galleryview from #88 is the canonical visual-diff reference — every chart in every vibe, every brand kit, every texture tier on one page. Spot-check it before and after; CI lib/mcp gates are unaffected.See spec for the phased plan, full codemod target list, and risks.
(Closes-out point for the dependabot PR #110, which is being closed as superseded by this tracking issue.)