設計師該選哪一個？
依你偏好的工作方式決定。Cursor 讓你留在編輯器中，看著程式碼一步步改變 — 最適合視覺化的反覆調整。Claude Code 以 agent 的形式在終端機中執行 — 最適合委派整套建置、再檢視結果。入門價格相近：Cursor Pro 每月 $20，Claude Pro 年繳每月 $17。
Cursor 與 Claude Code 並列比較。
| 選項 | 介面 | 價格 | 工作方式 | 最適合 |
|---|---|---|---|---|
| Cursor | 獨立的 AI 程式碼編輯器 | Hobby 免費；Pro 每月 $20 | 你能看到每個檔案，並在編輯器中即時掌控每次修改 | 想邊看邊調整、邊學程式碼的設計師 |
| Claude Code | 在終端機、桌面應用程式或網頁上執行的 agent | 隨附於 Claude Pro — 年繳每月 $17，月繳 $20 | 你描述想要的結果；agent 編輯檔案並回報結果 | 想委派整套建置、再檢視結果的設計師 |
什麼情況下 Cursor 更適合。
精細的視覺化反覆調整 — 微調間距、嘗試三種主視覺版本、了解 CSS 實際在做什麼。編輯器讓程式碼隨時可見，因此每次修改都是學習，而免費的Responsive Preview command能把版面檢查變成一句對話指令。依照設計工作設定指南，十分鐘就能完成設定。
什麼情況下 Claude Code 更適合。
整套任務：「把 markdown 轉 PDF 的工具做成單一 HTML 檔案」、「為整個網站加上深色模式」、「用這份上線檢查清單來檢查我的 repo」。agent 會規劃、編輯多個檔案，並執行指令，不需要你逐步操控。小型網頁工具指南示範了這個流程 — 這個網站上的免費工具就是這樣做出來的。
兩者並用的工作方式。
兩者並非互斥：這個網站本身就是兩者並用打造的 — Claude Code 負責搭建骨架與多檔案工作，Cursor 負責快速的視覺化調整（參見這家商店是怎麼做出來的）。設計師常見的分工是：先用 Claude Code 做出能用的版本，再用 Cursor 調整到滿意為止。
兩者都試試看。
想走編輯器路線，可以使用這個 Cursor 推薦連結，第一個月享 5 折優惠的 Pro 方案。想走 agent 路線，這個 Claude 推薦連結可以開通包含 Claude Code 的 Claude 方案。