跳轉到主要內容
成品目前處於測試版。它們需要 Team 或 Enterprise 方案，以及使用 /login 登入的工作階段。請參閱可用性以了解完整的需求集合。
成品是一個即時互動網頁，Claude Code 從您的工作階段發佈到 claude.ai 上的私人 URL。您在瀏覽器中開啟它，當工作階段繼續進行時，它會就地更新。當您想讓隊友看到它時，可以從頁面標題中分享它。例如，使用成品來引導審查者查看帶有註解差異的拉取請求、從工作階段資料建立儀表板，或保持調查時間軸，隨著 Claude 工作而填入。
在 claude.ai/code/artifact 的瀏覽器中開啟的成品。檢視器標題顯示成品標題 acme-funnel-fix、分享按鈕和作者頭像。分享選單已開啟，顯示'始終分享最新版本'切換、版本選擇器顯示'分享版本 2'、'Acme 的所有人'受眾選擇器和複製連結按鈕。在標題下方，成品頁面顯示兩個並排的行動裝置模型、漏斗圖表和一行指標卡片。
本頁涵蓋如何：

​
何時使用成品

當終端文字不是 Claude 產生的內容的正確媒介時，請使用成品：輸出更容易查看和互動，而不是逐行閱讀。Claude 從您的工作階段可以到達的任何內容建立頁面，包括您的程式碼庫和它通過您的連接工具提取的資料，因此頁面可以顯示需要段落才能描述的內容。例如，要求 Claude：
  • 引導審查者查看帶有註解差異的拉取請求
  • 從工作階段已經提取的資料呈現儀表板
  • 並排排列多個設計或實現選項
  • 保持調查時間軸，在長任務執行時填入
  • 向隊友發送連結，而不是將輸出貼到 Slack
請參閱您可以建立的內容以了解與每個內容相符的提示。

​
成品不是什麼

成品是工作的捕捉，不是應用程式。它是一個自包含的頁面，沒有後端，因此無法儲存表單輸入、在檢視時呼叫 API 或提供多個路由。對於具有後端的託管內部工具，請改為在您自己的基礎設施上部署它。請參閱頁面限制以了解完整的限制集合。

​
建立成品

當輸出適合頁面時，Claude 可能會自動發佈成品，或者您可以直接要求一個。要要求，請用純語言命名功能或描述您想要的視覺輸出。任何比作為文字閱讀更容易看到的內容都是很好的候選，例如註解差異、圖表或一組要比較的選項。下面的提示是兩個示例；請參閱您可以建立的內容以了解更多模式。 
Make an artifact that walks through this PR with the diff annotated inline.

Build a dashboard artifact of last week's deploy failures by service and keep it updated as you investigate.
Claude 將頁面寫入您的專案中的 HTML 或 Markdown 檔案，然後發佈它。在發佈新成品之前，Claude Code 會要求許可；它可能會說類似 Claude wants to publish "Deploy failures by service" (deploy-failures.html) to a private page on claude.ai 的內容。重新發佈您已經批准的成品不會再次提示。 選擇是以發佈。Claude 列印 URL，您的瀏覽器會開啟到新頁面。隨時按 Ctrl+] 從終端重新開啟最近的成品。 Claude 為成品選擇標題和瀏覽器標籤圖示的表情符號。兩者都出現在您在 claude.ai 上的成品庫和共享連結中，因此如果您想要特定的標題或圖示，請要求 Claude 使用一個。 要停止瀏覽器在發佈新成品時自動開啟，請在您的環境中設定 CLAUDE_CODE_ARTIFACT_AUTO_OPEN=0。 如果 Claude 回應它無法發佈，或寫入沒有連結的本地 HTML 檔案，則該工具未為您的工作階段啟用。檢查可用性要求。

​
更新成品

要求 Claude 修訂頁面，或讓長時間執行的任務在進行時重新發佈。Claude 編輯基礎檔案並重新發佈到相同的 URL。 
Add a per-region breakdown below the summary chart and republish.
任何開啟頁面的人都會看到就地更新。每次發佈都會成為一個版本，從頁面標題中的分享控制項，您可以選擇檢視者看到哪個版本。 要從不同的工作階段更新成品，請給 Claude 成品的 URL 並要求它修訂。沒有 URL，新工作階段總是建立新成品，而不是更新現有的。 
Update https://claude.ai/code/artifact/5fbea6f3-... with today's numbers.

​
分享成品

新成品只對您可見。在瀏覽器中開啟它，並使用頁面標題中的分享控制項向您組織中的特定人員或所有人授予存取權限。標題將您命名為成品的作者，因此任何您與之分享的人都可以看到誰發佈了頁面。它還連結到您在 claude.ai/code/artifacts 的庫，其中列出您建立的每個成品。 分享停止在您的組織。檢視者必須以發佈成品的同一組織的成員身份登入 claude.ai，並且沒有選項可以使成品在組織外可見。要將基礎內容發送給組織外的人，請要求 Claude 提供 HTML 檔案並直接分享該檔案。 成品是可檢視的，不是共同編輯的。您分享的人看到您發佈的每個版本，但無法更改頁面；您仍然是唯一的寫入者。

​
您可以建立的內容

成品是單個 HTML 頁面，因此您可以用 HTML、CSS 和內聯 JavaScript 表達的任何內容都在範圍內。下面的模式最常出現。

​
逐步查看變更

要求一個頁面，在相關行旁邊呈現差異或設計變更並帶有註解，以便審查者可以在程式碼旁邊閱讀您的推理，而不是從描述中重建它。 
Make an artifact that walks through this PR. Render the diff with margin annotations and color-code findings by severity.

​
比較替代方案

要求在一個頁面上有多個變體，以便您可以相互評估它們。這適用於佈局、複製、API 形狀或實現計劃。 
Make an artifact with four distinctly different layouts for the settings panel. Vary density and grouping, and lay them out as a grid with a one-line tradeoff under each.

​
使用互動控制項進行調整

要求滑塊、切換或輸入欄位綁定到您正在調整的任何內容，以便您可以直接探索值，而不是描述它們。 
Build an artifact with sliders for the easing curve, duration, and delay so I can try values on this transition. Show the animation live as I move them.

​
將結果帶回您的工作階段

成品可以充當輕量級編輯器，用於您隨後交給 Claude 的決定。要求匯出控制項，產生您可以貼到終端的文字，以便與頁面互動的結果流回工作階段，而不是停留在頁面上。 
Make a triage board artifact with each open issue as a draggable card across Now, Next, Later, and Cut columns. Add a "Copy as prompt" button that gives me the final ordering to paste back here.

​
追蹤進行中的工作

要求 Claude 在長任務執行時保持成品最新，以便任何有連結的人都可以跟進，而無需閱讀終端。 
Turn this migration plan into a checklist artifact. Check items off as you complete them and add a note for anything you skip.

​
改進視覺設計

Claude 在建立成品時應用內建設計技能，因此頁面無需額外提示即可獲得刻意的調色板、排版和佈局。該技能還會在選擇自己的設計之前在您的專案中尋找現有的設計系統。要保持成品與您產品品牌的一致性，請在 Claude 可以找到的地方記錄您的設計令牌，例如專案的 CLAUDE.md 或您的儲存庫中的主題檔案： 
## Design system

- Colors: primary #1a4d8f, accent #f59e0b, surface #f8fafc
- Typography: Inter for body, JetBrains Mono for code
- Spacing: 8px scale, 6px border radius
Claude 將您的設計系統視為比其自己選擇更高的優先級，並將您的提示視為比兩者都更高的優先級。上面的標題和格式是一個示例；任何清晰的顏色、字體和間距列表都有效。

​
頁面限制

每個成品是一個自包含的頁面。Claude Code 將您發佈的檔案包裝在 HTML 文件殼中，並在嚴格的內容安全政策 (CSP) 下提供它，這形成了頁面可以做什麼。
限制效果
無外部請求CSP 阻止從任何其他主機載入的指令碼、樣式表、字體和影像，以及 fetch、XHR 和 WebSocket 呼叫。Claude 內聯 CSS 和 JavaScript，並將影像嵌入為資料 URI，以便頁面無需任何外部請求即可呈現。
無後端成品是靜態頁面。它無法儲存通過表單提交的資料、自行驗證檢視者或在檢視時呼叫 API。
單頁相對連結無法解析，因為沒有任何內容與頁面一起部署。對於多部分內容，Claude 使用頁面內錨點而不是單獨的檔案。
來源檔案類型發佈的檔案必須是 .html、.htm 或 .md。Markdown 檔案呈現為樣式化的 HTML。
呈現大小呈現的頁面必須為 16 MiB 或更小。大型嵌入影像是發佈因大小而失敗的常見原因。
生成成品使用輸出令牌，就像任何其他回應一樣，樣式化頁面比相同內容作為終端文字更耗令牌。內聯 CSS、用於互動控制項的 JavaScript，尤其是嵌入為資料 URI 的影像是主要貢獻者。要減少成品的令牌成本：
  • 對於圖表，優先使用 SVG 或 HTML 和 CSS，而不是嵌入的光柵影像
  • 省略您不需要的互動性
  • 讓頁面總結大型資料集，而不是完整內聯它們

​
可用性

成品需要下面的每個條件。當不滿足其中一個時，Claude 寫入本地 HTML 檔案或說它無法發佈。
要求可用時間
方案Team 或 Enterprise。在 Team 方案上，成品預設開啟。在 Enterprise 方案上，管理員在 claude.ai 管理設定中啟用它們。
驗證使用 /login 登入 claude.ai。使用 API 金鑰、閘道令牌或雲端提供者認證的工作階段無法發佈。
模型提供者Anthropic API。在 Amazon Bedrock、Google Cloud Vertex AI 或 Microsoft Foundry 上不可用。
組織政策客戶管理的加密金鑰 (CMEK)、HIPAA 和零資料保留未為組織啟用。
表面Claude Code CLI，或 Claude 桌面應用程式版本 1.13576.0 或更新版本。在 Agent SDK、GitHub Action 和 MCP 伺服器上下文中預設關閉，以及當設定 CLAUDE_CODE_DISABLE_NONESSENTIAL_TRAFFIC 時。

​
停用成品

要根據您組織的設定為您自己的工作階段關閉成品，請使用以下任何一個：
方法設定
設定檔"disableArtifact": true
環境變數CLAUDE_CODE_DISABLE_ARTIFACT=1
許可規則將 Artifact 新增到 permissions.deny

​
為您的組織管理成品

Team 和 Enterprise 方案上的管理員從 claude.ai 管理設定控制成品。成品內容儲存在 Anthropic 營運的基礎設施上，僅對發佈組織的已驗證成員可見。

​
啟用或停用成品

要為整個組織啟用或停用成品，請前往設定 > Claude Code > 功能並使用成品切換。在具有角色型存取控制的 Enterprise 方案上，您還可以將成品範圍限制為特定角色：前往設定 > 角色、編輯角色，並在 Claude Code 群組下設定成品許可。

​
設定保留政策

要設定在自動刪除之前保留成品的時間，請前往設定 > 資料和隱私控制。您可以為仍然是其作者私人的成品和已共享的成品設定單獨的保留期。

​
檢查稽核日誌

發佈、分享和刪除成品各自出現在您組織的稽核日誌中，位於 claude_artifact_* 事件類型下，與在 claude.ai 對話中建立的成品使用的相同系列。

​
允許列表檢視器網域

claude.ai 上的檢視器從沙箱化的 *.claudeusercontent.com 來源載入每個成品。如果您的組織限制出站網路存取，請將該網域新增到您的允許列表中，以及 claude.ai。請參閱網路存取要求以了解完整清單。

​
使用 Compliance API 列出和刪除成品

Compliance API 提供端點來列出組織的成品、檢索特定版本的內容和刪除成品：
方法端點
GET/v1/compliance/code/artifacts
GET/v1/compliance/code/artifacts/{artifact_id}/versions/{version_id}
DELETE/v1/compliance/code/artifacts/{artifact_id}
有關請求和回應架構，請參閱 Compliance API 參考。