{"enrichment":{"faq":[{"a":"tailwind-v3-to-v4-migration automates the initial upgrade, then guides you through the judgment calls a codemod cannot make. It reconciles dependencies, ports your config from JS to CSS-first @theme syntax, applies compat shims for v4's changed defaults (borders, rings, placeholders, cursor, dialog, hover), and runs visual parity testing to confirm your rendered output stays identical across Next.js, Vite, Tailwind CLI, and PostCSS setups.","q":"How do I migrate Tailwind 3 to 4 with zero visual regressions?"},{"a":"tailwind-v3-to-v4-migration identifies and helps you apply compat shims for v4's changed defaults: border, ring, placeholder, cursor, dialog, and hover behavior. Rather than leaving you to hunt down visual breaks, it flags which defaults shifted and provides the configuration snippets to restore v3 appearance where you need it, letting you upgrade safely without surprise regressions.","q":"What does tailwind-v3-to-v4-migration do about changed defaults?"},{"a":"Yes. tailwind-v3-to-v4-migration handles porting your Tailwind config from JavaScript to the CSS-first @theme syntax that v4 prefers. It translates your existing theme values, plugins, and customizations into the new format, reducing manual rewriting and helping you adopt v4's cleaner configuration model.","q":"Can tailwind-v3-to-v4-migration port my config from JS to CSS @theme?"},{"a":"tailwind-v3-to-v4-migration addresses Tailwind v4 build errors and unknown utility class issues that arise during upgrade. It reconciles dependency versions, updates PostCSS configuration, and validates that your @tailwind directives and custom utilities work correctly in v4, whether you're using Next.js, Vite, Tailwind CLI, or plain PostCSS.","q":"Does this tool resolve @tailwind directives errors in v4?"},{"a":"tailwind-v3-to-v4-migration includes visual parity testing to confirm migration completeness. After applying the codemod, compat shims, and config changes, it helps you verify that your rendered output matches v3, catching any missed utility renames (like bg-gradient-to \u2192 bg-linear-to) or default shifts before they reach production.","q":"How does tailwind-v3-to-v4-migration verify the upgrade is complete?"},{"a":"tailwind-v3-to-v4-migration works across Next.js, Vite, Tailwind CLI, and plain PostCSS setups. It reconciles dependencies and PostCSS configuration for each environment, so whether you're using a framework or standalone Tailwind, the migration path and compat shims apply correctly to your build.","q":"What build systems does tailwind-v3-to-v4-migration support?"}],"shadow_tags":["css-framework-upgrade","version-migration","breaking-changes","visual-regression-testing","config-porting","codemod-automation","css-first-architecture","backward-compatibility","build-tooling","framework-agnostic"],"summary_rewrite":"Automates the mechanical parts of upgrading from Tailwind v3 to v4, then handles the judgment calls the codemod can't: reconciling dependencies, porting config to CSS-first `@theme`, auditing v4's changed defaults (border, ring, placeholder, cursor, dialog, hover), and verifying the rendered output stays identical. Works across Next.js, Vite, Tailwind CLI, and plain PostCSS setups."},"files":[{"bytes":13588,"path":"skills/tailwind-v3-to-v4-migration/SKILL.md","sha256":"387cf31bb21762c1a9388f50725d2a62637664e88fcbf1e918d2cb4e12a13b8e","url":"https://skillfed.io/files/a-tokyo/agent-skills/tailwind-v3-to-v4-migration/c9d1a19e/SKILL.md"}],"id":"a-tokyo/agent-skills/tailwind-v3-to-v4-migration","links":{"html":"https://skillfed.io/a-tokyo/agent-skills/tailwind-v3-to-v4-migration","md":"https://skillfed.io/a-tokyo/agent-skills/tailwind-v3-to-v4-migration.md","repo":"https://github.com/a-tokyo/agent-skills"},"meta":{"agents_supported":[],"first_seen":"2026-07-28","forks":1,"language":"JavaScript","last_updated":"2026-07-26","license":"MIT","name":"tailwind-v3-to-v4-migration","publisher":"a-tokyo","stars":14},"relations":{"similar":[{"id":"nweii/agent-stuff/use-tailwind-v4"},{"id":"AsyrafHussin/agent-skills/tailwind-best-practices"},{"id":"ofershap/tailwind-best-practices/tailwind-best-practices"},{"id":"bytedance/agentkit-samples/byted-util-vite-react-tailwind"},{"id":"JosiahSiegel/claude-plugin-marketplace/tailwindcss-fundamentals-v4"},{"id":"skills-il/localization/hebrew-tailwind-preset"},{"id":"ruchernchong/claude-kit/heroui"},{"id":"mastra-ai/mastra/tailwind-v4"},{"id":"shipshitdev/skills/tailwind-validator"},{"id":"rekryt/skill-tailwind/skill-tailwind"}]},"slug":{"owner":"a-tokyo","repo":"agent-skills","skill":"tailwind-v3-to-v4-migration"},"version":"c9d1a19e"}