完整的 Tailwind CSS v4 文件快照與工作流程指引。用於回答 Tailwind v4 相關問題、選擇工具類/變體、設定 Tailwind v4，或根據官方文件與常見陷阱檢查將專案從 v3 遷移至 v4。
Tailwind 4 Docs
概述
使用此技能來瀏覽本地同步的 Tailwind CSS v4 文件快照，並根據官方指引回答開發、設定、遷移、實作、重構與審查相關問題。
文件快照未隨此技能一同打包，因為上游儲存庫為原始碼可用但非開源。使用者必須自行初始化快照，並負責遵守上游授權條款。
快速開始
- 檢查文件快照是否已初始化（
references/docs/與references/docs-index.tsx是否存在）。 - 如果快照遺失或超過一週未更新，請停止並要求執行「初始化」中的初始化步驟後再繼續。在快照初始化完成前，請勿回答使用者的問題。
- 識別主題（工具類、變體、設定、遷移、相容性、實作、重構、審查）。
- 在
references/docs-index.tsx中找到對應的文件。 - 僅載入
references/docs/中的相關檔案。 - 對於實作、重構或審查任務，同時載入
references/engineering-playbook.md。 - 套用指引，並指出任何重大變更或限制。
初始化（每次安裝只需執行一次）
執行同步腳本以下載 Tailwind 文件至本地。這需要網路連線、git 與 Python 3：
python skills/tailwind-4-docs/scripts/sync_tailwind_docs.py --accept-docs-license
此操作會從 tailwindlabs/tailwindcss.com 拉取內容。該儲存庫為原始碼可用且明確非開源，因此使用者必須在下載前接受其授權條款，並將快照保留在本地。
如果您無法執行工具或沒有網路連線，請要求使用者在終端機中執行上述命令，然後在 references/docs/ 與 references/docs-index.tsx 存在後再繼續。
如果快照遺失或超過一週未更新，您必須請求允許執行該命令，或要求使用者自行執行。在快照初始化或更新完成前，請勿繼續提供 Tailwind 指引。
如果初始化受阻（無網路或無寫入權限），請使用 references/gotchas.md 作為有限的替代方案，並要求使用者查閱官方文件。對於實作、重構或審查任務，references/engineering-playbook.md 也可作為有限的替代方案。
參考檔案對應
references/docs/為本地生成，包含 Tailwind v4 的 MDX 文件快照。references/docs-index.tsx為本地生成，包含文件側邊欄使用的分類與 slug 對應。references/docs-source.txt記錄上游儲存庫、提交與快照日期（或回報初始化待處理）。references/engineering-playbook.md為代理導向的實作、重構與審查指南。references/gotchas.md提供常見 v4 遷移陷阱的快速掃描。
MDX 處理方式
- 將
export const title與export const description視為元資料。 - 將
<TipInfo>或<TipBad>等 JSX 提示視為指引文字。
常見進入點
- 遷移：
references/docs/upgrade-guide.mdx、references/docs/compatibility.mdx。 - 實作/重構/審查：
references/engineering-playbook.md。 - 常見陷阱總覽：
references/gotchas.md。 - 設定與指令：
references/docs/functions-and-directives.mdx、references/docs/adding-custom-styles.mdx、references/docs/theme.mdx。 - 變體與響應式模式：
references/docs/hover-focus-and-other-states.mdx、references/docs/responsive-design.mdx。 - 核心行為：
references/docs/preflight.mdx、references/docs/detecting-classes-in-source-files.mdx。
遷移檢查清單
從 v3 升級至 v4 時，請務必在文件中確認以下事項：
- 瀏覽器支援與相容性預期。
- 工具鏈變更：
@tailwindcss/postcss、@tailwindcss/cli、@tailwindcss/vite。 - 匯入語法：
@import "tailwindcss"取代@tailwind指令。 - 工具類重新命名/移除、前綴格式與重要修飾符位置。
- 變體、變形與任意值語法的變更。
更新工作流程
執行 scripts/sync_tailwind_docs.py 以重新整理快照。如果您已有 tailwindlabs/tailwindcss.com 的本地克隆，可使用 --local-repo 加速同步。務必傳入 --accept-docs-license。
