你有沒有試過，跟 Claude 說「幫我做一個計算器」，然後它真的直接給你一個可以按按鈕的計算器？

這就是 Claude Artifacts 在做的事。不是給你一堆程式碼叫你自己貼，而是直接在對話旁邊跑出一個活生生的互動工具。

身為一個幾乎每天都在用 Claude 的人，我覺得 Artifacts 是目前 Claude 裡面最被低估的功能之一。這篇就來好好聊聊它到底能做什麼、怎麼用，以及 2026 年最新升級了哪些讓我眼睛一亮的新東西。

Claude Artifacts 是什麼？

簡單說，Artifacts 就是 Claude 把產出的內容「獨立呈現」的一個區域。

當你請 Claude 幫你寫一段 HTML 網頁、畫一個 SVG 圖示、或是做一個互動式的 React 元件，Claude 不會只把程式碼貼在對話框裡，而是會同步在右側開一個預覽視窗，讓你直接看到成品長什麼樣子。

更棒的是，你可以在預覽視窗裡直接操作這個工具——按按鈕、填表格、看圖表——完全不用去找開發環境或貼程式碼到其他地方。

Artifacts 能產出哪些類型的內容？

目前 Claude Artifacts 支援以下幾種類型：

• HTML + CSS + JavaScript：互動網頁、表單、計算機等
• React 元件：功能更複雜的互動介面
• SVG 圖形：圖示、插圖、簡單圖表
• Markdown 文件：格式化的文字稿、報告
• Mermaid 圖表：流程圖、時序圖、甘特圖

所以不管你是想做一個字數計算器、一個隨機抽籤工具、一份漂亮的備忘錄模板，還是一個視覺化的數據圖表，都在 Artifacts 的能力範圍內。

2026 年 Claude Artifacts 有哪些新升級？

老實說，2025 年底到 2026 年初，Anthropic 在 Artifacts 上做了幾個蠻大的更新，讓這個功能從「好用的小玩具」升級成「真正能拿來用的工具」。

1. AI Powered Artifacts：嵌入 AI 能力的應用

這是我覺得最厲害的一個。以前 Artifacts 做出來的工具是「靜態的」——就是一個計算機、一個表單，它不會思考。

現在有了 AI Powered Artifacts，你可以做出一個工具，讓使用者輸入問題後，這個工具會呼叫 Claude 的 API 來回答。也就是說，你可以用自然語言描述一個 AI 應用，Claude 直接幫你把它做出來。

比如說，你可以做一個「日文文法小老師」——使用者輸入一個句子，它幫你分析文法對不對、哪裡可以改進。以前要做這個需要會寫程式，現在跟 Claude 說說你的需求就好。

2. Live Artifacts：即時連接資料的儀表板

Live Artifacts 讓你做出的 Dashboard 可以自動抓取資料來源並即時更新，每次重新開啟都會拉最新的資料。

舉例來說，如果你有一個 Google Sheets 的銷售數據，你可以做一個 Live Artifacts 儀表板，每次打開都自動顯示最新的銷售圖表——不需要手動更新。

3. Persistent Storage：跨 Session 儲存資料

以前用 Claude 做工具有一個很大的限制：對話結束後，工具裡的資料就消失了。你做一個日記 App，今天寫的東西明天就不見了。

Persistent Storage 解決了這個問題。現在 Pro、Max、Team、Enterprise 方案的用戶，可以在 Artifacts 裡儲存最多 20MB 的資料，下次開啟同一個 Artifact 還會在。

這讓一些有「記憶」需求的工具成為可能：習慣追蹤器、學習紀錄、個人 CRM 等等。

怎麼開始用 Claude Artifacts？

不需要任何設定，只要有 Claude 帳號就能用（免費版也行，但功能有限制）。

Step 1：描述你想要的工具

第一個 Prompt 很重要。盡量把以下幾個點說清楚：

• 目的：這個工具要做什麼事？
• 使用方式：使用者怎麼和它互動？
• 視覺風格：有沒有偏好的顏色、字型、佈局？
• 技術格式：要用 HTML、React 還是其他格式？（不確定的話可以不說，讓 Claude 決定）

範例 Prompt：

「幫我做一個 BMI 計算器，使用者輸入身高（公分）和體重（公斤），按下計算後顯示 BMI 數值和對應的健康範圍說明。風格簡潔，用白底搭配藍色按鈕。用 HTML 製作。」

Step 2：查看預覽並測試

Claude 產出 Artifact 後，右側的預覽視窗會直接打開。你可以直接在裡面輸入數字、點按鈕，測試看看功能有沒有如你預期。

Step 3：用對話修改

如果哪裡不滿意，直接在對話框跟 Claude 說。不需要懂程式碼，就像跟設計師說「這個按鈕能不能移到右邊」、「字體能不能大一點」那樣說就好。

Claude 會直接更新 Artifact，你的預覽視窗也會同步刷新。

Step 4：分享或儲存

做好之後，點擊 Artifact 右上角的分享按鈕，可以複製連結分享給別人，對方不需要有 Claude 帳號也能使用你做的工具。

實際能做哪些工具？幾個我真的在用的例子

旅遊預算計算器

規劃旅遊的時候，我請 Claude 做了一個簡單的預算分配表——輸入總預算，它幫我自動分配機票、住宿、餐飲、景點的建議比例，還有剩餘金額即時顯示。做完直接存書籤，每次規劃旅遊都拿出來用。

每週習慣追蹤器

利用 Persistent Storage 功能，做了一個簡單的習慣打卡工具，每天打開確認今天的習慣有沒有完成，記錄會保留到下次。

免費版和付費版的差別

功能	免費版	Pro/Max 版
基本 Artifacts 製作	✅ 有，但有次數限制	✅ 無限制
AI Powered Artifacts	❌	✅
Live Artifacts	❌	✅
Persistent Storage	❌	✅（最多 20MB）
分享連結	✅	✅

如果你只是偶爾想做個小工具試試看，免費版夠用。如果你想把 Artifacts 當成正式的工作工具，Pro 版（每月 $20 美元）還是比較值得。

新手常見的幾個坑

Prompt 說得太模糊：只說「幫我做一個好用的工具」，Claude 不知道你要什麼。描述越具體，結果越接近你要的。

以為自己要懂程式才能修改：完全不需要！你只要說「我想要這裡改成紅色」、「再加一個欄位讓我輸入日期」，Claude 就會幫你改。

做完就忘了存：Artifact 的連結只在那次對話裡，如果你想之後還能找到，要把連結存起來，或是在 Claude 的 Artifacts 專區（帳號設定裡）找到它。

結語

Claude Artifacts 對我來說最大的意義，是讓「做工具」這件事不再是工程師的專利。

你有一個想法、一個需求，不需要學程式、不需要找開發者，自己跟 Claude 說說清楚，十分鐘內就能有一個可以用的東西。

2026 年的幾個新功能——AI Powered Artifacts、Live Artifacts、Persistent Storage——又讓這個可能性更大了一步。以前做出來的是「靜態小玩具」，現在可以做出真正有用的、會思考的、會記憶的工具。

如果你還沒試過，這週就去試試看吧。從一個簡單的計算器或是待辦清單開始，你會發現「原來這麼簡單」。