본문 바로가기

클로드 아티팩트(Artifacts) 사용법 — 생성·편집·공개(Publish)까지

클로드 아티팩트로 코드·문서·웹앱·그래픽을 대화 옆에서 만들고 편집·공유하는 법을 정리했습니다. 자동 생성 조건, 켜는 법, Publish/Share, Live·AI 아티팩트까지.

글갱신

아티팩트(Artifacts)는 클로드가 만든 결과물 — 코드, 문서, 웹페이지, 그래픽, 작은 앱 — 을 대화 옆 별도 창에 띄워 바로 보고, 편집하고, 공유할 수 있게 해주는 기능입니다. 복사해서 다른 곳에 붙여 넣을 필요 없이 그 자리에서 미리보고 다듬을 수 있습니다.

🟢 현행 모델 라인업 일치 · 모델 안내 · Fable 구독 안내
🟢 현행 모델 라인업 일치 · Claude Opus 5.5 / Claude Sonnet 5 / Claude Haiku 4.5 (상위 티어: Claude Fable 5.1). 이 안내는 새 모델이 출시될 때만 바뀝니다.

Fable 5·5.1 구독 안내(2026년 9월 7일 갱신): 2026년 9월 1일 출시된 Claude Fable 5.1이 현행 Fable 모델이고, Fable 5는 레거시로 전환됐습니다. 구독 조건은 두 모델이 같습니다 — Max·Team Premium 플랜은 주간 사용 한도의 50% 범위에서 포함되고, Pro·Team Standard 플랜은 사용량 크레딧(입력 100만 토큰당

🟢 현행 모델 라인업 일치 · Claude Opus 5.5 / Claude Sonnet 5 / Claude Haiku 4.5 (상위 티어: Claude Fable 5.1). 이 안내는 새 모델이 출시될 때만 바뀝니다.
0, 출력 $50)으로 이용합니다. 일회성
🟢 현행 모델 라인업 일치 · Claude Opus 5.5 / Claude Sonnet 5 / Claude Haiku 4.5 (상위 티어: Claude Fable 5.1). 이 안내는 새 모델이 출시될 때만 바뀝니다.
00 크레딧은 Fable 5 전환 당시에만 지급됐고 5.1에는 없습니다. 일부 코딩·디버깅 요청은 보안 분류기에 의해 Opus 모델로 대체 응답될 수 있습니다(두 모델 공통). 자세한 내용은 Fable 5.1 가이드와 Fable 5 재개 안내를 참조하세요.

아티팩트로 만들 수 있는 것 코드 • 여러 언어 스크립트 HTML 앱 • 웹페이지·간단한 게임 React • 인터랙티브 UI 문서·파일 • 마크다운 문서 • docx·pptx·xlsx·pdf 그래픽 • SVG·Mermaid 다이어그램 Live 대시보드 • 데이터 자동 갱신 전 플랜(무료 포함)에서 사용. 자립적이고 보통 15줄 이상인 결과물은 자동으로 아티팩트가 됩니다(2026년 9월 재확인).

아티팩트는 언제 생기나

클로드는 결과물이 자립적(그 자체로 완결)이고 보통 15줄 이상일 때 자동으로 아티팩트를 만듭니다(코드, HTML, 다이어그램, 문서 등). 또는 "이걸 아티팩트로 만들어줘"라고 직접 요청해도 됩니다. 아티팩트는 대화 오른쪽 별도 패널에 렌더되고, 클로드가 수정하면 미리보기가 즉시 갱신됩니다.

아티팩트 종류별 — 무엇을 언제 만드나

아티팩트는 한 종류가 아니라 결과물 성격에 따라 여러 형태로 나뉩니다(2026년 6월 공식 안내 기준, 9월 재확인). 무엇을 만들지에 따라 적합한 종류가 달라집니다.

아티팩트 7가지 종류 — 무엇을 만들까마크다운.md읽는 문서코드30여 개 언어재사용 코드HTML.html동작하는 화면React.jsx반응형 위젯SVG.svg로고·아이콘Mermaid.mermaid순서도·도식문서 파일docx·pptx·xlsx·pdf전달용 완성본어느 걸 만들지 고민되면목적만 말하세요. 예: PDF로 받게 해줘, 순서도로 그려줘→ 클로드가 알맞은 종류를 자동으로 골라줍니다
  • 마크다운 문서(.md) — 서식 있는 글. 보고서·제안서·회의 안건·튜토리얼처럼 읽는 문서에 적합.
  • 코드·스크립트 — 30여 개 언어를 구문 강조해 표시. 함수·스니펫·설정 파일 등 그대로 가져다 쓸 코드에 적합.
  • HTML 웹페이지(.html) — HTML·CSS·JavaScript를 한 파일에 담아 즉시 렌더. 랜딩페이지·입력 폼·계산기·간단한 게임 같은 단일 파일로 동작하는 화면에 적합.
  • React 컴포넌트(.jsx) — 상태(state)·이벤트가 있는 인터랙티브 UI(Tailwind 스타일·Recharts 차트 활용 가능). 계산기·시뮬레이터·대시보드처럼 입력에 반응하는 위젯에 적합.
  • SVG 벡터 그래픽(.svg) — 확대해도 깨지지 않는 벡터 이미지. 로고·아이콘·인포그래픽·도식에 적합(복잡한 그림보다 단순·정밀한 도형이 잘 나옵니다).
  • Mermaid 다이어그램(.mermaid) — 글로 설명하면 그림으로. 순서도·시퀀스·ER 다이어그램·간트차트·마인드맵 등 구조·흐름 시각화에 적합.
  • 다운로드 문서(.docx·.pptx·.xlsx·.pdf) — 워드·파워포인트·엑셀·PDF 파일로 받기(패널에서 PDF 미리보기도 가능). 전달용 완성 파일에 적합.

어느 종류로 만들지 헷갈리면 목적만 말해도 됩니다("PDF로 받게 해줘", "순서도로 그려줘") — 보통 클로드가 적절한 형태를 자동으로 고릅니다. 여러 종류를 조합하면(예: HTML + 인터랙티브 컴포넌트) 더 풍부한 결과를 만들 수 있습니다.

켜는 법

대부분의 계정은 기본으로 켜져 있습니다(2026년 2월 이후 만든 무료 계정은 자동). 만약 아티팩트가 안 보이면 설정(Settings) → 기능 미리보기(Feature Preview)에서 Artifacts를 켜세요. 전 플랜(무료·Pro·Max·Team·Enterprise)에서 쓸 수 있습니다.

만들고 다듬기

  1. 원하는 것을 설명합니다. 예: "할 일 트래커 만들어줘", "이 데이터로 막대 차트 그려줘".
  2. Preview(미리보기) 탭에서 결과를 확인하고, 후속 프롬프트로 다듬습니다("색을 바꿔줘", "버튼 추가해줘").
  3. 더 손대고 싶으면 Code(코드) 탭에서 HTML·CSS·JS 등 코드를 직접 확인·편집할 수 있습니다.

공유하기

  • Publish(게시) — 무료·Pro·Max: 공개 링크를 만듭니다. 받는 사람은 클로드 계정 없이도 열어보고 상호작용할 수 있습니다. 예전에는 계정 사용자가 리믹스 버튼으로 편집 가능한 사본을 만들 수 있었지만, 지금 공식 도움말(2026년 9월 18일 확인)은 그 버튼을 언급하지 않고 대신 게시된 아티팩트의 코드를 복사해 새 대화에 붙여 넣고 원하는 변경을 요청하는 방식("Build on a published artifact")만 안내합니다(무료·Pro·Max 가능, 원본에는 영향 없음). 게시 뒤에는 "Get embed code"로 다른 웹사이트에 삽입할 수도 있으며, 게시를 취소(Unpublish)하면 같은 아티팩트는 다시 게시할 수 없고 저장 데이터도 삭제됩니다.
  • Share(공유) — Team·Enterprise: 조직 내부에만 공개됩니다(로그인 필요). 2026년 7월 13일부터는 Team·Enterprise에서 여러 명이 같은 아티팩트를 동시에 편집하는 멀티플레이어 편집이 추가됐고, Claude Code·Claude Tag(Slack)에서 만든 아티팩트도 공개 링크로 공유할 수 있습니다.

⚠️ 게시(Publish)한 아티팩트는 공개되며 검색엔진에 색인될 수 있습니다. 민감한 내용은 게시하지 마세요.

새 Claude 경험에서는 공유 방식이 다릅니다(2026년 9월 18일 공식 도움말 기준). 채팅과 Cowork가 하나로 합쳐진 새 Claude 경험이 Pro·Max에 순차 적용되고 있는데, 이 경험에서 만든 아티팩트(Claude Design·Slides·Docs·Claude Code 결과물 포함)는 위의 Publish가 아니라 아티팩트의 Share(공유) 대화상자로 공유합니다 — "나만" 또는 "링크가 있는 누구나"를 고르고, 최신 버전을 보여줄지 특정 버전을 고정할지 정합니다. 이 방식으로 공유한 아티팩트는 여는 사람도 Claude 계정이 필요합니다. 게시(Publish)·임베드 코드·코드 복사는 이전 경험의 채팅에서 만든 아티팩트에만 제공됩니다. 입력창에 "Chat"과 "Cowork" 선택지가 아직 보인다면 이전 경험이며, 이 경우 위 Publish/Share 안내가 그대로 적용됩니다.

더 강력한 기능

  • Live 아티팩트: 다시 열 때마다 최신 데이터로 갱신되는 대시보드·트래커.
  • AI 기반 아티팩트: 아티팩트가 클로드 API를 직접 호출해, 정적 화면이 아니라 똑똑하게 동작하는 앱을 만들 수 있습니다.
  • 영속 저장: 아티팩트당 일정 용량(약 20MB로 안내됨)의 데이터를 세션 간 유지.
  • MCP 연결: 캘린더·Gmail·Slack 등 외부 서비스와 연동(연결은 MCP 연결 가이드).
  • 다운로드 파일: docx·pptx·xlsx·pdf 같은 파일도 아티팩트로 받을 수 있습니다.
대화로 만들고, 옆 패널에서 다듬기왼쪽: 대화"가계부 앱 만들어줘""버튼 색 바꿔줘""표도 추가해줘"오른쪽: 아티팩트 패널결과물이 실시간으로생성·갱신·미리보기→ 완성되면 공유코드·문서·다이어그램 등을 대화하며 반복해 다듬습니다 · 기준 2026.6

팁

편집·반복 작업은 웹/데스크톱이 모바일보다 편합니다(모바일 앱은 주로 보기 용도). 아티팩트와 기능 전반은 프로젝트·아티팩트·메모리 기능 정리도 함께 보세요.

캔버스에서 더 본격적인 디자인·프로토타입을 만들고 싶다면 Claude 디자인을 참고하세요.

고지: 아티팩트의 종류·공유 방식·용량·켜는 위치는 플랜과 버전에 따라 다르고 바뀔 수 있습니다(일부 수치는 변동 가능). 이 글은 작성 시점(2026년 6월)의 Anthropic 공식 안내(support.claude.com) 기준입니다. 최신 정보는 공식 안내에서 확인하세요. 본 사이트는 Anthropic 공식 사이트가 아닙니다.

관련 글

이 글이 도움이 됐나요?

이어서 읽어보세요

독자들이 이어 읽은 글

클로드 공개 링크 공유 방법 — 만들기부터 해제까지 (feat. 무엇이 안 보일까)

클로드 대화를 계정 없는 사람도 볼 수 있게 만드는 공개 링크의 생성·해제 방법과, 무엇이 공유되고 무엇은 공유되지 않는지 정리했습니다.

164

Claude 앱 '스킬 탐색' 총정리 — 플러그인 60개의 역할·사용법·자동 실행 여부 (2026년 9월)

설정 → 스킬 → 탐색에 나열된 영어 이름의 플러그인들이 각각 무엇을 하고, 어떻게 부르며, 사람이 없을 때도 자동으로 돌아가는지 — 실제 설치한 60개의 SKILL.md와 공식 문서를 기준으로 정리했습니다.

65

Claude로 웹소설 '딸깍' 가능할까 — 현실적으로 되는 것과 안 되는 것

AI에게 소재만 던지면 웹소설이 완결까지 알아서 써진다는 기대가 있지만, 실제로 Claude가 잘하는 일과 여전히 작가가 해야 하는 일은 따로 있습니다. Projects·Styles 등 실제 기능으로 현실적인 활용법을 정리했습니다.

38

긴 대화에서 캐릭터 설정이 흐려질 때 — Claude 프로젝트로 페르소나 컨텍스트 지키는 법

공들여 만든 나만의 캐릭터(페르소나)와 오래 대화하다 보면 말투나 설정이 흐트러지는 경우가 있습니다. Claude의 프로젝트 지침·지식 기능으로 페르소나 설정을 안정적으로 유지하는 방법을 정리했습니다.

37