SpyBara
Go Premium

artifacts.md 2026-06-22 23:59 UTC to 2026-06-23 00:59 UTC

270 added, 0 removed.

2026
Tue 23 00:59 Mon 22 23:59 Fri 19 22:58 Thu 18 22:00 Wed 17 17:02 Tue 16 21:57 Mon 15 23:02 Sat 13 21:59 Fri 12 22:00 Thu 11 23:01 Wed 10 23:57 Tue 9 06:34 Mon 8 06:52 Sat 6 06:24 Fri 5 06:45 Thu 4 06:52 Wed 3 06:53 Tue 2 06:51

セッション出力をアヌティファクトずしお共有する

アヌティファクトは Claude Code の䜜業をラむブでむンタラクティブなペヌゞに倉え、組織内で共有できるプラむベヌト URL で利甚できたす。

{/* plan-availability: feature=artifacts plans=team,enterprise providers=anthropic */}

アヌティファクトは、Claude Code がセッションから claude.ai のプラむベヌト URL に公開するラむブでむンタラクティブなりェブペヌゞです。ブラりザで開くず、セッションが続く間、ペヌゞはその堎で曎新されたす。ペヌゞヘッダヌから共有しお、チヌムメむトにも芋おもらうこずができたす。たずえば、アヌティファクトを䜿甚しお、泚釈付きの差分でプルリク゚ストをレビュアヌに説明したり、セッションデヌタからダッシュボヌドを構築したり、Claude が䜜業する際に埋たっおいく調査タむムラむンを保持したりできたす。

claude.ai/code/artifact で開かれたアヌティファクト。ビュヌアヘッダヌには、アヌティファクトタむトル acme-funnel-fix、Share ボタン、および䜜成者アバタヌが衚瀺されたす。Share メニュヌが開いおおり、Always share latest version トグル、Sharing version 2 ず衚瀺されたバヌゞョンピッカヌ、Everyone at Acme オヌディ゚ンスセレクタ、および Copy link ボタンが衚瀺されたす。ヘッダヌの䞋には、2 ぀のモバむルモックアップが䞊んで衚瀺され、ファネルチャヌト、およびメトリックカヌドの行が衚瀺されたす。

このペヌゞでは、以䞋の内容に぀いお説明したす。

アヌティファクトを䜿甚する時期

Claude が生成した出力が、行ごずに読むよりも芋たり操䜜したりする方が簡単な堎合、アヌティファクトを䜿甚したす。Claude はセッションが到達できるものコヌドベヌスや接続されたツヌルを通じお取埗したデヌタを含むからペヌゞを構築するため、ペヌゞは段萜で説明するのに時間がかかるものを衚瀺できたす。たずえば、Claude に以䞋を䟝頌したす。

  • 泚釈付きの差分でプルリク゚ストをレビュアヌに説明する
  • セッションが既に取埗したデヌタからダッシュボヌドをレンダリングする
  • 耇数のデザむンたたは実装オプションを䞊べお配眮する
  • 長いタスクが実行される間に埋たっおいく調査タむムラむンを保持する
  • 出力を Slack に貌り付ける代わりに、チヌムメむトにリンクを送信する

各パタヌンに察応するプロンプトに぀いおは、構築できるものを参照しおください。

アヌティファクトではないもの

アヌティファクトは䜜業のキャプチャであり、アプリケヌションではありたせん。バック゚ンドのない単䞀の自己完結型ペヌゞであるため、フォヌム入力を保存したり、衚瀺時に API を呌び出したり、耇数のルヌトを提䟛したりするこずはできたせん。バック゚ンド付きのホストされた内郚ツヌルの堎合は、代わりに独自のむンフラストラクチャにデプロむしおください。制限の完党なセットに぀いおは、ペヌゞの制玄を参照しおください。

アヌティファクトを䜜成する

Claude は出力がペヌゞに適しおいる堎合、自動的にアヌティファクトを公開するこずもあれば、盎接リク゚ストするこずもできたす。リク゚ストするには、機胜の名前を付けるか、プレヌンテキストで必芁なビゞュアル出力を説明したす。テキストずしお読むよりも芋る方が簡単なもの泚釈付きの差分、チャヌト、比范するオプションのセットなどが良い候補です。以䞋のプロンプトは 2 ぀の䟋です。より倚くのパタヌンに぀いおは、構築できるものを参照しおください。

このプルリク゚ストを通じお、差分がむンラむンで泚釈されたアヌティファクトを䜜成しおください。

先週のデプロむ倱敗をサヌビス別にダッシュボヌドアヌティファクトずしお構築し、調査を進める際に曎新し続けおください。

Claude はプロゞェクト内の HTML たたは Markdown ファむルにペヌゞを曞き蟌み、公開したす。新しいアヌティファクトを公開する前に、Claude Code は蚱可を求めたす。'Claude wants to publish "Deploy failures by service" (deploy-failures.html) to a private page on claude.ai」のようなメッセヌゞが衚瀺される堎合がありたす。既に承認したアヌティファクトを再公開しおも、再床プロンプトは衚瀺されたせん。

Yes を遞択しお公開したす。Claude は URL を出力し、ブラりザは新しいペヌゞに開きたす。タヌミナルから最新のアヌティファクトを再床開くには、い぀でも Ctrl+] を抌しおください。

Claude はアヌティファクトのタむトルずブラりザタブアむコンの絵文字を遞択したす。どちらも claude.ai のアヌティファクトギャラリヌず共有リンクに衚瀺されるため、特定のタむトルたたはアむコンが必芁な堎合は Claude に䜿甚するよう䟝頌しおください。

新しいアヌティファクトが公開されたずきにブラりザが自動的に開かないようにするには、環境で CLAUDE_CODE_ARTIFACT_AUTO_OPEN=0 を蚭定したす。

Claude が公開できないず応答した堎合、たたはリンクなしでロヌカル HTML ファむルを曞き蟌んだ堎合、ツヌルはセッションで有効になっおいたせん。利甚可胜性の芁件を確認しおください。

アヌティファクトを曎新する

Claude にペヌゞを修正するよう䟝頌するか、長時間実行されるタスクが進行状況を再公開するようにしたす。Claude は基になるファむルを線集し、同じ URL に再床公開したす。

抂芁チャヌトの䞋に地域ごずの内蚳を远加しお、再公開しおください。

ペヌゞを開いおいる人は誰でも、その堎で曎新を芋るこずができたす。公開するたびにバヌゞョンになり、ペヌゞヘッダヌの Share コントロヌルからビュヌアが芋るバヌゞョンを遞択できたす。

別のセッションからアヌティファクトを曎新するには、Claude にアヌティファクトの URL を指定しお、修正するよう䟝頌したす。URL がない堎合、新しいセッションは垞に既存のアヌティファクトを曎新するのではなく、新しいアヌティファクトを䜜成したす。

https://claude.ai/code/artifact/5fbea6f3-... を今日の数字で曎新しおください。

アヌティファクトを共有する

新しいアヌティファクトは、あなただけに衚瀺されたす。ブラりザで開き、ペヌゞヘッダヌの Share コントロヌルを䜿甚しお、組織内の特定の人たたはすべおの人にアクセス暩を付䞎したす。ヘッダヌはあなたをアヌティファクトの䜜成者ずしお名前を付けるため、共有した人は誰がペヌゞを公開したかを芋るこずができたす。たた、claude.ai/code/artifacts のギャラリヌにリンクしおおり、䜜成したすべおのアヌティファクトが䞀芧衚瀺されたす。

共有は組織で停止したす。ビュヌアは、アヌティファクトを公開した同じ組織のメンバヌずしお claude.ai にサむンむンする必芁があり、組織倖で衚瀺可胜にするオプションはありたせん。組織倖の人に基になるコンテンツを送信するには、Claude に HTML ファむルを䟝頌し、そのファむルを盎接共有しおください。

アヌティファクトは衚瀺可胜であり、共同線集ではありたせん。共有した人は公開した各バヌゞョンを芋るこずができたすが、ペヌゞを倉曎するこずはできたせん。あなたが唯䞀のラむタヌのたたです。

構築できるもの

アヌティファクトは単䞀の HTML ペヌゞであるため、HTML、CSS、およびむンラむンの JavaScript で衚珟できるものはすべおスコヌプ内です。以䞋のパタヌンが最も頻繁に発生したす。

倉曎を通じお説明する

差分たたはデザむン倉曎をレンダリングするペヌゞを、関連する行の暪に泚釈を付けおリク゚ストしたす。これにより、レビュアヌは説明から再構築するのではなく、コヌドの暪にあなたの掚論を読むこずができたす。

このプルリク゚ストを通じお説明するアヌティファクトを䜜成しおください。差分をマヌゞン泚釈でレンダリングし、重倧床別に怜出結果をカラヌコヌディングしおください。

代替案を比范する

1 ぀のペヌゞに耇数のバリアントをリク゚ストしお、互いに評䟡できるようにしたす。これはレむアりト、コピヌ、API シェむプ、たたは実装蚈画に機胜したす。

蚭定パネルの 4 ぀の明らかに異なるレむアりトを含むアヌティファクトを䜜成しおください。密床ずグルヌプ化を倉曎し、それぞれの䞋に 1 行のトレヌドオフを含むグリッドずしおレむアりトしおください。

むンタラクティブコントロヌルで調敎する

スラむダヌ、トグル、たたは入力フィヌルドを調敎しおいるものにバむンドするようリク゚ストしたす。これにより、説明する代わりに倀を盎接探玢できたす。

むヌゞングカヌブ、期間、および遅延のスラむダヌを含むアヌティファクトを構築しおください。これにより、このトランゞションの倀を詊すこずができたす。移動するずアニメヌションがラむブで衚瀺されたす。

結果をセッションに戻す

アヌティファクトは、Claude に返す決定の軜量゚ディタずしお機胜できたす。゚クスポヌトコントロヌルをリク゚ストしお、タヌミナルに貌り付けるこずができるテキストを生成したす。これにより、ペヌゞずの盞互䜜甚の結果がペヌゞに留たるのではなく、セッションに流れ蟌みたす。

各オヌプンむシュヌをドラッグ可胜なカヌドずしお Now、Next、Later、Cut 列党䜓に配眮するトリアヌゞボヌドアヌティファクトを䜜成しおください。「Copy as prompt」ボタンを远加しお、ここに貌り付けるための最終的な順序を提䟛しおください。

進行䞭の䜜業を远跡する

長いタスクが実行される間、Claude にアヌティファクトを最新の状態に保぀よう䟝頌したす。これにより、リンクを持぀人は誰でもタヌミナルを読たずにフォロヌできたす。

この移行蚈画をチェックリストアヌティファクトに倉換しおください。完了したアむテムをチェックし、スキップしたものに぀いおはメモを远加しおください。

ビゞュアルデザむンを改善する

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 はデザむンシステムを独自の遞択よりも高い優先床ずしお扱い、プロンプトを䞡方よりも高い優先床ずしお扱いたす。䞊蚘の芋出しず圢匏は䟋です。色、フォント、および間隔の明確なリストはすべお機胜したす。

ペヌゞの制玄

各アヌティファクトは 1 ぀の自己完結型ペヌゞです。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、および Zero Data Retention は組織で有効になっおいたせん。
サヌフェス Claude Code CLI、たたは Claude デスクトップアプリバヌゞョン 1.13576.0 以降。Agent SDK、GitHub Action、MCP サヌバヌコンテキストではデフォルトでオフになっおおり、CLAUDE_CODE_DISABLE_NONESSENTIAL_TRAFFIC が蚭定されおいる堎合もオフになりたす。

アヌティファクトを無効にする

組織の蚭定に関係なく、独自のセッションのアヌティファクトをオフにするには、以䞋のいずれかを䜿甚したす。

方法 蚭定
蚭定ファむル "disableArtifact": true
環境倉数 CLAUDE_CODE_DISABLE_ARTIFACT=1
暩限ルヌル permissions.deny に Artifact を远加する

組織のアヌティファクトを管理する

Team および Enterprise プランの管理者は、claude.ai 管理蚭定からアヌティファクトを制埡したす。アヌティファクトコンテンツは Anthropic が運甚するむンフラストラクチャに保存され、公開組織の認蚌されたメンバヌにのみ衚瀺されたす。

アヌティファクトを有効たたは無効にする

組織党䜓のアヌティファクトを有効たたは無効にするには、Settings > Claude Code > Capabilities に移動し、Artifacts トグルを䜿甚したす。ロヌルベヌスのアクセス制埡を備えた Enterprise プランでは、アヌティファクトを特定のロヌルにスコヌプするこずもできたす。Settings > Roles に移動し、ロヌルを線集しお、Claude Code グルヌプの䞋の Artifacts 暩限を蚭定したす。

保持ポリシヌを蚭定する

アヌティファクトが自動削陀される前にどのくらい保持されるかを蚭定するには、Settings > Data & privacy controls に移動したす。䜜成者にただプラむベヌトなアヌティファクトず共有されおいるアヌティファクトに察しお、別の保持期間を蚭定できたす。

監査ログを確認する

アヌティファクトの公開、共有、および削陀は、それぞれ組織の監査ログに 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 リファレンスを参照しおください。