Si vous avez utilisé Claude Code plus de quelques minutes, vous connaissez le schéma habituel : le modèle résout un problème dans votre terminal, produit quelque chose de vraiment utile — un diff annoté, une chronologie d'incident, une liste classée d'options — et tout cela reste prisonnier de votre historique de terminal. Le partager signifie coller des murs de texte dans Slack ou demander à un collègue de vous faire confiance sur votre résumé.
Les Artifacts Claude Code changent la donne. N'importe quelle session peut désormais publier son résultat sous forme de page web privée et vivante sur claude.ai. La page se met à jour sur place pendant que la session continue, et vous la partagez avec un seul lien. Pas de déploiement, pas de copier-coller, pas de contexte perdu.
Qu'est-ce qu'un Artifact Claude Code ?
Un artifact est une page HTML autonome que Claude Code publie depuis votre session vers une URL sur claude.ai. Ouvrez-la dans un navigateur et elle affiche tout ce que le modèle a produit — diffs, graphiques, checklists, contrôles interactifs — sans le bruit visuel du terminal. Pendant que la session continue de travailler, la même URL se rafraîchit sur place.
Les Artifacts ont été lancés en bêta le 18 juin 2026 et sont désormais disponibles sur les abonnements Pro, Max, Team et Enterprise. Vous avez besoin de Claude Code CLI version 2.1.183 ou ultérieure et d'une session authentifiée via /login.
Comment Créer un Artifact
Pas besoin de commande spéciale. Demandez au modèle en langage naturel :
Make an artifact that walks through this PR with the diff annotated inline.ou
Build a dashboard artifact of last week's deploy failures by service
and keep it updated as you investigate.Le modèle écrit un fichier HTML ou Markdown dans votre projet, puis demande la permission avant de publier : "Claude wants to publish 'Deploy failures by service' to a private page on claude.ai." Approuvez une fois et les mises à jour suivantes du même artifact se publient silencieusement. Le modèle affiche l'URL et votre navigateur ouvre automatiquement la page.
Pour désactiver l'ouverture automatique, définissez CLAUDE_CODE_ARTIFACT_AUTO_OPEN=0 dans votre environnement. Appuyez sur Ctrl+] à tout moment pour rouvrir le dernier artifact depuis le terminal.
Six Cas d'Usage et les Prompts Qui Fonctionnent
1. Revues de Pull Requests
Créez une page qui affiche le diff avec vos annotations dans la marge, pour que les relecteurs voient le contexte à côté du code :
Make an artifact that walks through this PR. Render the diff with margin annotations
and color-code findings by severity.Un seul lien à partager, au lieu d'une longue description de PR.
2. Chronologies d'Investigation
Pour les incidents et les sessions de débogage, maintenez une chronologie vivante qui se remplit au fil du travail du modèle :
Build a timeline artifact for this incident. Add each finding as you confirm it
and mark the root cause when we identify it.Les membres de l'équipe suivent la progression en temps réel sans regarder votre terminal.
3. Comparaison d'Alternatives
Mettez les options d'implémentation côte à côte sur une seule page pour une évaluation collective :
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.Fonctionne aussi bien pour les API, les textes et les plans d'implémentation.
4. Ajustement Interactif
Ajoutez des contrôles pour les valeurs que vous ajustez et explorez-les visuellement :
Build an artifact with sliders for easing curve, duration, and delay
so I can try values on this transition. Show the animation live as I move them.5. Suivi de Progression pour les Tâches Longues
Pour les migrations, refactorisations et opérations en lot, gardez l'artifact à jour tout au long :
Turn this migration plan into a checklist artifact.
Check items off as you complete them and add a note for anything you skip.6. Renvoyer les Résultats vers la Session
Un artifact peut servir d'outil de décision léger qui renvoie ses résultats au modèle :
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.Données Vivantes avec les Connecteurs MCP
Les Artifacts peuvent appeler vos connecteurs MCP à chaque fois que quelqu'un ouvre la page, pas seulement quand le modèle l'a construite. Nécessite la version CLI 2.1.209 ou ultérieure.
Build a dashboard artifact of our open pull requests that pulls the live list
through my GitHub connector when the page loads.Les appels de chaque spectateur passent par son propre compte de connecteur. Deux personnes ouvrant le même tableau de bord peuvent voir des données différentes selon leurs permissions. La page ne voit jamais les identifiants de personne — claude.ai effectue les appels réseau au nom de la page.
Important : les artifacts connectés aux MCP ne peuvent pas être partagés via des liens publics sur aucun abonnement. Ils restent confinés à votre organisation.
Partage et Collaboration
Un nouvel artifact est visible uniquement par vous. Pour partager, ouvrez l'artifact dans le navigateur et utilisez le contrôle Share dans l'en-tête de la page.
Abonnements Pro et Max : lien public uniquement. Toute personne ayant le lien peut voir la page sans se connecter.
Abonnements Team et Enterprise : partagez avec des membres spécifiques de l'organisation ou avec tous. Les spectateurs se connectent avec leur compte organisationnel. Le partage public est désactivé par défaut jusqu'à ce qu'un propriétaire l'active dans les paramètres sous Settings → Claude Code → Capabilities → External sharing.
Éditeurs : sur les abonnements Team et Enterprise, vous pouvez accorder à un collègue le rôle d'éditeur. Il donne l'URL de l'artifact au modèle dans sa propre session, et le modèle republie avec ses modifications. Toutes les personnes ayant la page ouverte voient chaque mise à jour en direct.
Intégration du Système de Design
Depuis la version CLI 2.1.183, le modèle applique une compétence de design intégrée lors de la construction des artifacts — palette, typographie et espacement réfléchis, sans prompts supplémentaires. Pour que les artifacts soient cohérents avec votre marque, ajoutez vos tokens de design dans votre CLAUDE.md :
## Design system
- Colors: primary #1a4d8f, accent #f59e0b, surface #f8fafc
- Typography: Inter for body, JetBrains Mono for code
- Spacing: 8px scale, 6px border radiusLe modèle accorde une priorité plus élevée à votre système de design qu'à ses propres choix.
Contraintes Techniques
Les Artifacts sont délibérément statiques. La politique de sécurité du contenu (CSP) stricte bloque toutes les requêtes externes — pas de scripts, polices, images ou appels fetch externes. Le modèle intègre tout directement. Les appels aux connecteurs MCP sont la seule exception ; la page les délègue à claude.ai.
| Contrainte | Ce que cela signifie |
|---|---|
| Pas de backend | Ne peut pas stocker les données de formulaire ni authentifier les spectateurs |
| Page unique | Les liens relatifs ne se résolvent pas ; le modèle utilise des ancres internes |
| Types de fichiers | .html, .htm ou .md uniquement |
| Limite de taille | La page rendue doit faire moins de 16 Mio |
Pour réduire le coût en tokens : privilégiez SVG ou CSS pour les diagrammes plutôt que les images raster intégrées, omettez l'interactivité dont vous n'avez pas besoin, et demandez à la page de résumer les grands ensembles de données plutôt que de les intégrer entièrement.
Prérequis de Disponibilité
| Prérequis | Détails |
|---|---|
| Abonnement | Pro, Max, Team ou Enterprise |
| Authentification | Session connectée via /login ; les sessions par clé API ne peuvent pas publier |
| Fournisseur de modèle | API Anthropic uniquement — pas Bedrock, Vertex ou Foundry |
| Version CLI | 2.1.183 ou ultérieure (ou application Desktop 1.13576.0 ou ultérieure) |
| Politique organisationnelle | Configurations CMEK, HIPAA et Zero Data Retention non prises en charge |
Désactiver les Artifacts
Pour désactiver les artifacts dans vos propres sessions :
# Variable d'environnement
CLAUDE_CODE_DISABLE_ARTIFACT=1
# Fichier de paramètres (settings.json)
# "disableArtifact": trueSur les abonnements Team et Enterprise, les propriétaires désactivent les artifacts pour toute l'organisation sous Settings → Claude Code → Capabilities.
En Résumé
Les Artifacts Claude Code résolvent un problème réel : la sortie du terminal est excellente pour celui qui l'exécute et presque inutile pour tout le monde. Un seul prompt transforme le travail d'une session en page partageable et vivante qui se met à jour sur place, sans déploiement de votre côté.
Pour les équipes qui utilisent déjà Claude Code, c'est le chemin le plus rapide de "le modèle a trouvé la solution" à "mon équipe peut voir ce que le modèle a trouvé" — sans copier-coller, sans captures d'écran, sans contexte perdu.
Essayez dès votre prochaine revue PR : Make an artifact that walks through this PR with the diff annotated inline. Le lien est prêt avant que votre relecteur ouvre GitHub.