메인 콘텐츠로 건너뛰기
아티팩트는 Pro, Max, Ultra, Team, Enterprise 플랜에서 사용 가능하며 /login으로 로그인한 세션이 필요합니다. 전체 요구사항은 가용성을 참조하십시오.
아티팩트는 Claude Code가 세션에서 claude.ai의 비공개 URL로 게시하는 라이브 인터랙티브 웹 페이지입니다. 브라우저에서 열 수 있으며, 세션이 계속되면서 제자리에서 업데이트됩니다. 다른 사람이 보기를 원할 때 페이지 헤더에서 공유하십시오.
claude.ai/code/artifact에서 열린 아티팩트입니다. 뷰어 헤더는 아티팩트 제목 acme-funnel-fix, 공유 버튼, 작성자 아바타를 표시합니다. 공유 메뉴는 최신 버전 항상 공유 토글, 버전 2를 읽는 버전 선택기, Acme 대상 선택기의 모든 사람, 링크 복사 버튼과 함께 열려 있습니다. 헤더 아래에서 아티팩트 페이지는 나란히 두 개의 모바일 목업, 깔때기 차트, 메트릭 카드 행을 표시합니다.

​
아티팩트를 사용해야 할 때

Claude가 생성한 결과물이 터미널 텍스트로는 부적절한 경우 아티팩트를 사용하세요. 즉, 한 줄씩 읽는 것보다 보고 상호작용하기가 더 쉬운 결과물입니다. Claude는 코드베이스와 연결된 도구를 통해 가져온 데이터를 포함하여 세션이 접근할 수 있는 모든 것으로부터 페이지를 구축하므로, 설명하는 데 여러 문단이 필요할 만한 것들을 페이지에 표시할 수 있습니다. 예를 들어 Claude에 다음을 요청하세요:
  • 주석이 달린 diff를 포함하여 검토자에게 풀 요청 설명하기
  • 세션이 이미 가져온 데이터로부터 대시보드 렌더링하기
  • 여러 설계 또는 구현 옵션을 나란히 배치하기
  • 긴 작업이 실행되는 동안 조사 타임라인 유지하기
  • Slack에 출력을 붙여넣는 대신 팀원에게 링크 보내기
  • MCP 커넥터를 통해 새로운 데이터를 가져오는 상태 보드 게시하기
이러한 항목과 일치하는 프롬프트는 구축할 수 있는 것을 참조하고, 커넥터 기반 보드의 프롬프트는 MCP 커넥터를 통해 라이브 데이터 가져오기를 참조하세요.

​
아티팩트가 아닌 것

아티팩트는 작업의 캡처입니다. 백엔드가 없는 자체 포함된 페이지이므로 여러 경로를 제공할 수 없습니다. 호스팅된 백엔드가 있는 내부 도구의 경우 대신 자신의 인프라에 배포하세요. 제한 사항의 전체 집합은 페이지 제약 사항을 참조하세요.

​
아티팩트 생성

Claude는 출력이 페이지에 적합할 때 자동으로 아티팩트를 게시할 수 있으며, 직접 요청할 수도 있습니다. 요청하려면 기능의 이름을 지정하거나 원하는 시각적 출력을 일반 언어로 설명하면 됩니다. 좋은 후보는 텍스트로 읽는 것보다 보는 것이 더 쉬운 것들입니다. 예를 들어 주석이 달린 diff, 차트 또는 비교할 옵션 집합 등이 있습니다. 아래 프롬프트는 두 가지 예시입니다. 더 많은 패턴은 빌드할 수 있는 것을 참조하십시오.
위치를 지정하지 않으면 Claude는 프로젝트 외부의 임시 디렉터리에 있는 HTML 또는 Markdown 파일에 페이지를 작성한 후 게시합니다. 아티팩트는 공유할 때까지 사용자에게만 비공개로 유지됩니다. 첫 번째 게시 후 Claude는 URL을 출력하고 브라우저가 새 페이지로 열립니다.
  • 페이지 다시 열기: 언제든지 Ctrl+]를 눌러 세션의 가장 최근 아티팩트를 다시 열 수 있습니다
  • 이 세션의 아티팩트 보기: 프롬프트 아래의 ⧉ 알약 표시에 아티팩트 이름이 표시되며, 세션에 아티팩트가 여러 개인 경우 개수가 표시됩니다. 전체 화면 렌더링에서 이를 클릭하면 /artifacts 목록이 열립니다
  • 브라우저가 열리지 않도록 하기: 환경에서 CLAUDE_CODE_ARTIFACT_AUTO_OPEN=0을 설정합니다
  • Remote Control: Remote Control을 통해 claude.ai, Claude Desktop 또는 Claude 모바일 앱에서 프롬프트를 보낸 경우 세션을 실행하는 머신에서 탭이 열리지 않습니다. 터미널에서 입력한 프롬프트로부터 Claude가 아티팩트를 게시할 때 다음에 그 머신에서 브라우저가 열립니다
Claude는 아티팩트의 제목과 차트나 달력과 같이 페이지의 성격에 맞는 브라우저 탭 아이콘을 선택합니다. 제목은 claude.ai의 아티팩트 갤러리와 공유 링크에 나타납니다. 특정 제목이나 탭 아이콘을 원하면 Claude에게 요청하십시오. Claude가 게시할 수 없다고 응답하거나 링크 없이 로컬 HTML 파일을 작성하면 세션에 아티팩트가 활성화되지 않은 것입니다. 가용성 요구 사항을 확인하십시오. 터미널에 Artifacts need a claude.ai login이 표시되면 로그인 방법은 해당 오류 항목을 참조하십시오.

​
Claude Code가 게시 전에 확인을 요청하는 경우

입력한 프롬프트에 응답하여 Claude가 게시하는 새 아티팩트는 권한 프롬프트나 분류기 검토 없이 진행됩니다. 다음과 같은 경우에는 Claude Code가 먼저 사용자에게 확인을 요청하거나, 자동 모드에서는 분류기가 게시를 검토합니다. 사용자의 승인 없이 Claude가 작업 디렉터리 외부의 파일을 읽을 수 있도록 하려면 실행 시 --add-dir로, 또는 세션 중에 /add-dir로 해당 폴더를 작업 디렉터리로 추가하십시오. Claude는 이러한 디렉터리와 페이지를 작성하는 임시 디렉터리에 있는 파일은 이미 묻지 않고 읽습니다. 게시 프롬프트에 Also makes 1 edit to that file on disk.와 같은 문장이 포함되어 있으면 Claude가 아티팩트 파일을 변경하고 게시하는 작업을 한 단계로 수행하는 것입니다. 프롬프트를 승인하면 Claude Code는 페이지를 게시한 다음 변경 사항을 파일에 씁니다.

​
아티팩트 업데이트

Claude에 페이지를 수정하도록 요청하거나, 장시간 실행되는 작업이 진행되면서 다시 게시하도록 할 수 있습니다. Claude는 기본 파일을 편집하고 동일한 URL로 다시 게시합니다.
페이지를 열어 있는 모든 사용자는 업데이트를 즉시 확인할 수 있습니다. 각 게시는 버전이 되며, 페이지 헤더의 공유 컨트롤에서 뷰어가 볼 수 있는 버전을 선택할 수 있습니다. 다른 세션에서 아티팩트를 업데이트하려면 Claude에 해당 URL을 제공하거나 /artifacts로 첨부합니다. 둘 다 없으면 새 세션이 기존 아티팩트를 업데이트하는 대신 새 아티팩트를 만듭니다.

​
아티팩트 다시 찾기

Claude Code에서 /artifacts를 실행하여 소유한 아티팩트와 공유받은 아티팩트를 나열합니다. 현재 세션의 아티팩트가 This session 아래에 먼저 표시됩니다. 아티팩트를 선택한 다음 다음 키 중 하나를 누릅니다.
  • Enter: 현재 세션에 이미 첨부되어 있으면 브라우저에서 열고, 첨부되어 있지 않으면 첨부합니다
  • o: 브라우저에서 엽니다
  • c: 링크를 복사합니다
  • d: 클라우드 세션 외부에서 사용하며, 확인을 거친 후 소유한 아티팩트를 영구적으로 삭제합니다. 해당 링크는 본인을 포함한 모든 사람에게 더 이상 작동하지 않습니다
Claude Code는 claude.ai 계정에서 목록을 읽으므로, 아티팩트의 링크가 터미널에서 스크롤되어 사라진 경우에도 /artifacts는 새 세션에서, 그리고 /clear 이후에도 작동합니다.

​
아티팩트 공유하기

새로운 아티팩트는 처음에는 사용자에게만 표시됩니다. 공유하려면 브라우저에서 아티팩트를 열고 페이지 헤더의 공유 컨트롤을 사용하십시오. 헤더에는 claude.ai/code/artifacts의 갤러리로 연결되는 링크도 있으며, 여기에는 사용자가 생성한 모든 아티팩트가 나열됩니다. 조직의 뷰어는 페이지를 게시한 사람을 볼 수 있습니다. 조직 내에서 공유된 아티팩트의 경우 사용자의 이름이 제목 메뉴에 표시되고, 공개 아티팩트의 경우 조직의 로그인한 뷰어를 위해 페이지 헤더에 표시됩니다. 로그인하지 않고 공개 링크를 열거나 조직 외부에서 열어본 뷰어는 사용자의 이름 대신 Content is user-generated and unverified. 레이블을 봅니다. 공유할 수 있는 대상은 사용자의 플랜에 따라 다릅니다.
  • 조직 내: Team 및 Enterprise 플랜에서는 조직의 특정 사람 또는 모든 사람에게 액세스 권한을 부여할 수 있습니다. 뷰어는 페이지를 보기 위해 조직의 구성원으로 claude.ai에 로그인합니다.
  • 공개: 인터넷의 누구나 열 수 있는 링크를 공유하며, claude.ai 로그인이 필요하지 않습니다. Team 및 Enterprise 플랜에서는 공개 공유가 활성화될 때까지 비활성화되어 있으며, Owner가 조직에 대해 공개 공유를 활성화해야 합니다.
페이지에 탭이나 섹션 같은 여러 보기가 있는 경우 그중 하나로 직접 연결할 수 있습니다. Claude에게 링크를 요청하십시오.
각 링크는 #overview와 같이 끝에 앵커가 붙은 아티팩트 링크입니다.

​
다른 사람이 함께 편집하도록 허용하기

공유한 사람들은 기본적으로 뷰어입니다. 즉, 사용자가 게시한 각 버전을 볼 수 있지만 페이지를 변경할 수 없습니다. Team 및 Enterprise 플랜에서는 누군가를 편집자로 만들 수도 있습니다. 공유 대화 상자에서 사람을 추가하고 역할을 뷰어에서 편집자로 전환합니다. 편집자는 다른 세션에서 아티팩트를 업데이트하는 것과 같은 방식으로 새 버전을 게시합니다. 즉, Claude에 아티팩트의 URL을 제공하거나 /artifacts에서 첨부하면 Claude가 현재 콘텐츠를 가져와 변경 사항과 함께 다시 게시합니다. 페이지를 열어본 모든 사람이 각 업데이트를 실시간으로 봅니다. Claude가 페이지의 이전 사본을 가지고 있는 동안 편집자가 게시하면, Claude Code는 해당 사본을 기반으로 한 게시를 거부합니다. 그러면 Claude는 변경 사항을 최신 버전에 병합한 후 다시 게시합니다.

​
공유받은 아티팩트 읽기

누군가 아티팩트를 공유할 때, Claude가 이를 읽도록 할 수 있습니다. Claude에 URL을 제공하거나 /artifacts에서 첨부하면 됩니다. Claude는 다른 사람이 작성한 페이지를 WebFetch로 웹 페이지를 읽는 방식으로 읽습니다. 원본 페이지 대신 요청한 내용의 요약을 받으며, 요약은 페이지에 작성된 지시사항을 전달하는 대신 보고합니다. Claude Code는 또한 페이지의 전체 소스를 로컬 파일로 저장하므로, Claude는 편집자로 아티팩트를 다시 게시하는 등 정확한 내용이 필요할 때 파일을 열 수 있습니다. 다음과 같은 경우 Claude Code는 권한 모드나 규칙에 따라 표시되는 프롬프트와 별도로, Claude가 아티팩트를 읽기 전에 사용자의 승인을 요청합니다.
  • 네트워크 액세스가 없는 클라우드 세션: 클라우드 환경의 경우 None 수준에 해당합니다. 자동 모드에서는 분류기가 대신 승인할 수 있으며, Cowork 세션에서는 사용자만 승인할 수 있습니다.
  • 다른 조직의 공개 아티팩트: 자동 모드에서도 Claude Code는 먼저 사용자에게 묻습니다. bypassPermissions 모드처럼 Claude Code가 사용자에게 물을 수 없는 경우 Claude는 아티팩트를 읽을 수 없습니다. Claude는 기능 플래그 가져오기가 켜져 있는 동안에만 이러한 아티팩트를 읽을 수 있습니다.
  • 확인되지 않은 소유자 또는 네트워크 설정: Claude Code가 아티팩트를 만든 사람을 확인할 수 없거나 클라우드 세션의 네트워크 설정을 확인할 수 없는 경우 사용자에게 묻으며, 사용자의 승인은 해당 요청 한 건에만 적용됩니다.
  • 플랜 모드: 플랜 모드에서는 Claude Code가 Artifact 도구가 조직 내 다른 사람이 만든 아티팩트를 읽기 전에 사용자에게 묻습니다.
Claude가 WebFetch로 아티팩트를 읽을 때는 WebFetch 자체의 프롬프트 규칙도 계속 적용됩니다.

​
아티팩트에 대한 댓글 수집

조직 내에서 아티팩트를 공유할 때, 공유 대상자들은 페이지에 댓글을 남길 수 있으며, Claude가 해당 댓글을 읽고 답변할 수 있습니다. Claude Code v2.1.221 이상이 필요합니다. Claude는 두 가지 경우에 댓글을 읽습니다:
  • Claude에게 읽도록 요청하는 경우: Claude에게 아티팩트의 URL을 제공하고 댓글을 요청합니다. Claude는 각 스레드를 나열하고 아티팩트를 편집할 수 있는 사람이 보낸 댓글을 표시합니다.
  • 아티팩트를 편집할 수 있는 사람이 Claude에게 댓글을 보내는 경우: 페이지의 스레드에서 Send to Claude로 댓글을 보내거나 @claude를 언급합니다. 어느 쪽이든 스레드가 활성화됩니다.
Claude는 활성화된 스레드에만 답변하거나 해결할 수 있습니다. 다른 스레드는 사람이 페이지에서 해결할 때까지 열린 상태로 유지됩니다. 뷰어는 각 답변이 Claude에게 귀속되는 것을 봅니다(당신을 통해). 아티팩트를 공개적으로 공유하면, 공개 링크만으로 접근하는 사람들은 댓글을 볼 수 없으며 추가할 수도 없습니다. 기존 댓글 스레드는 아티팩트에 남아 있으며, 당신과 편집자들은 여전히 읽고 답변할 수 있습니다. 직접 댓글을 요청하려면 Claude에게 URL을 제공하십시오:
Claude가 댓글을 읽을 수 없다고 말하면 버전, 세션 및 기능 플래그 설정을 확인하십시오:
  • Claude Code v2.1.221 이상을 실행 중입니다.
  • Claude Code를 설치하거나 v2.1.221 이전 버전에서 업그레이드한 후 첫 번째 세션이 아닙니다. 설치 또는 업그레이드 후 첫 번째 세션에서는 Claude가 아직 댓글을 ��지 못할 수 있습니다. 새 세션을 시작하고 다시 요청하십시오.
  • 기능 플래그 가져오기를 끄지 않았습니다.

​
Claude가 댓글에 자동으로 답변하도록 허용

세션이 아티팩트를 게시한 후 Claude Code는 해당 아티팩트의 댓글을 감시합니다. 아티팩트를 편집할 수 있는 사람이 Claude에게 댓글을 보내면 즉시 세션에 도달하고, Claude는 사용자가 요청하지 않아도 스레드를 읽고 답변할 수 있습니다. Claude Code v2.1.228 이상이 필요합니다. 기능 플래그 가져오기를 끄면 Claude Code는 댓글을 감시하지 않습니다. 권한 모드는 보낸 댓글이 도착할 때 Claude가 수행하는 작업을 결정합니다:
  • Claude가 자동으로 답변합니다: 권한 모드가 Claude가 사용자에게 묻지 않고 답변을 게시하도록 허용할 때, Claude는 스레드를 읽고 답변합니다. Auto-replied to comment thread on Artifact: <name>이 표시됩니다.
  • Claude가 당신을 기다립니다: 계획 모드 외부에서 답변 게시에 승인이 필요할 때, Comments are waiting on Artifact: <name>이 표시됩니다. Claude는 스레드를 읽을 승인을 요청하고, 다시 답변을 게시할 승인을 요청합니다.
  • Claude가 계획 모드에서 일시 중지됩니다: Comments are waiting on Artifact: <name>이 표시되고, 계획 모드를 종료하고 스레드를 읽고 답변하도록 요청할 때까지 Claude는 답변하지 않습니다.
Claude는 또한 1시간 내에 해당 아티팩트에서 60개의 보낸 댓글 또는 스레드 활성화를 처리한 후 아티팩트에 자동으로 답변하는 것을 중지합니다. Comments are waiting on Artifact: <name>이 한 번 표시되고, Claude는 해당 시간의 댓글이 오래되면서 다시 시작합니다. /tasks를 실행하면 세션이 감시 중인 아티팩트를 확인할 수 있습니다. /tasks는 Claude Code가 자동으로 시작한 감시를 System tasks 행 아래에 그룹화합니다. 해당 행에서 Enter를 누르면 목록이 표시됩니다. 사용자가 Claude에게 시작하도록 요청한 감시는 Monitors 아래에 표시됩니다. 다음 방법 중 하나로 Claude가 자동으로 답변하는 것을 중지할 수 있습니다:
  • 유휴 프롬프트에서 Ctrl+C를 한 번 누릅니다: Claude는 세션이 감시 중인 모든 아티팩트에 답변하는 것을 일시 중지합니다. 다음 메시지를 보낸 후 답변이 다시 시작됩니다.
  • /tasks에서 작업을 중지합니다: Claude는 당신이 해당 아티팩트에서 답변을 재개하도록 요청할 때까지 해당 아티팩트에 답변하는 것을 중지합니다. 아티팩트를 다시 게시해도 답변이 다시 시작되지 않으며, 세션을 재개할 때도 중지가 계속 적용됩니다.
  • 3초 내에 Ctrl+X Ctrl+K를 두 번 누릅니다: 모든 실행 중인 백그라운드 서브에이전트를 중지하는 코드는 또한 Claude가 세션의 나머지 기간 동안 모든 아티팩트에 답변하는 것을 중지합니다. Claude에게 답변을 재개하도록 요청해도 이 중지는 취소되지 않습니다.
Claude Code가 자동으로 시작한 감시는 아티팩트에 몇 시간 동안 활동이 없으면 종료될 수 있습니다. 감시를 다시 시작하려면 아티팩트를 다시 게시하거나 Claude에게 감시하도록 요청하십시오. 댓글을 전달하는 서비스를 사용할 수 없거나 응답을 중지하면 Claude Code는 한동안 다시 연결을 시도한 후 세션이 감시 중이던 각 아티팩트 감시를 중지합니다.

​
MCP 커넥터로 실시간 데이터 가져오기

아티팩트는 누군가 이를 볼 때마다 MCP 커넥터를 호출할 수 있으므로, 페이지는 이를 구축한 세션에서 수집한 스냅샷이 아닌 현재 데이터를 표시합니다. 아티팩트의 커넥터 호출은 Pro, Max, Ultra, Team, Enterprise 플랜에서 사용 가능하며 Claude Code v2.1.209 이상이 필요합니다. 이전 버전에서는 Claude가 세션이 구축하는 동안 수집한 데이터로 페이지를 게시합니다. 커넥터 기반 페이지를 만들려면 프롬프트에서 커넥터와 원하는 데이터의 이름을 지정합니다:
Claude는 게시의 일부로 페이지가 호출할 수 있는 커넥터를 선언하며, 페이지는 해당 선언 외의 커넥터를 호출할 수 없습니다. claude.ai 계정의 커넥터만 적격입니다: Claude가 선언에서 이름을 지정하고, 누군가 페이지를 볼 때 각 호출은 보는 계정의 자체 연결을 통해 해당 커넥터로 실행됩니다. .mcp.json과 같이 Claude Code에서 구성하는 로컬 MCP 서버는 Claude가 페이지를 구축하는 동안 데이터를 제공할 수 있지만, 게시된 페이지는 이들을 호출할 수 없습니다. 페이지는 로드될 때 데이터를 가져오며 간격에 따라 새로 고치거나 보는 사람이 페이지의 새로 고침 컨트롤을 사용할 때 새로 고칠 수 있습니다. 응답은 보는 사람의 브라우저에 캐시되므로, 다시 열린 페이지는 캐시된 응답에서 즉시 렌더링된 후 새로운 결과로 업데이트됩니다.

​
보는 사람을 위한 커넥터 호출의 작동 방식

게시된 페이지가 커넥터를 호출할 때, 호출은 이를 게시한 사람의 계정이 아닌 페이지를 보는 사람의 계정을 사용합니다:
  • 각 보는 사람이 자신의 커넥터를 사용합니다: 호출은 보는 계정의 연결된 도구를 통해 이루어지므로, 같은 대시보드를 여는 두 사람은 자신의 계정이 액세스할 수 있는 것에 따라 다른 데이터를 볼 수 있습니다. 페이지는 누구의 자격 증명도 보지 않습니다; claude.ai가 페이지를 대신하여 호출을 수행합니다.
  • 보는 사람이 먼저 액세스를 승인합니다: claude.ai는 페이지의 첫 번째 커넥터 호출 전에 각 보는 사람에게 권한을 요청합니다. 거부하거나 페이지가 사용하는 커넥터를 연결하지 않은 보는 사람도 실시간 섹션 없이 페이지를 볼 수 있습니다.
  • 작업도 보는 사람의 계정을 사용합니다: 페이지는 메시지 게시 또는 이슈 업데이트와 같은 부작용이 있는 커넥터 도구를 호출하는 컨트롤을 제공할 수 있습니다. 작업은 컨트롤을 선택하는 사람의 계정을 통해 이루어집니다.
커넥터 기반 페이지를 공유할 계획이라면, Claude에게 각 실시간 섹션에 필요한 커넥터의 이름을 지정하는 폴백 메시지를 포함하도록 요청합니다. 연결이 없는 보는 사람은 빈 섹션 대신 연결할 항목을 봅니다. 조직 내에서 또는 공개적으로 커넥터 기반 페이지를 공유할 수 있으며, 플랜 및 조직 설정이 허용하는 범위 내에서 가능합니다. claude.ai에 로그인하지 않고 공개 링크를 열거나 조직 외부에서 열기를 하는 보는 사람에 대해서는 커넥터 호출이 실행되지 않습니다. 해당 보는 사람은 실시간 섹션 없이 페이지를 봅니다.

​
보는 사람을 위해 페이지에 실시간 데이터가 표시되지 않음

커넥터 기반 페이지가 렌더링되지만 조직의 보는 사람에 대해 실시간 섹션이 비어 있을 때, 다음 원인을 확인합니다:
  • 보는 사람이 커넥터를 연결하지 않았습니다: 커넥터는 계정별이므로, 각 보는 사람은 페이지가 호출하는 모든 커넥터에 대한 자신의 연결이 필요합니다. claude.ai의 Customize > Connectors에서 추가한 후 페이지를 다시 로드할 수 있습니다.
  • 보는 사람이 권한 요청을 거부했습니다: 거부는 해당 페이지 로드의 나머지 기간 동안 지속됩니다. 페이지를 다시 로드하면 권한 요청이 다시 나타납니다.
  • 조직에 대해 커넥터 호출이 꺼져 있습니다: 소유자가 관리자 설정에서 아티팩트 커넥터 활성화 토글을 제어합니다.
  • 페이지가 커넥터가 노출하지 않는 도구 이름을 호출합니다: 영향을 받는 섹션은 당신을 포함한 모든 사람에게 비어 있습니다. 이는 페이지가 자신의 도구만 몇 개 노출하는 게이트웨이 스타일 커넥터 뒤의 개별 도구의 이름을 지정할 때 발생할 수 있습니다. Claude에게 페이지가 호출하는 도구 이름을 수정하고 다시 게시하도록 요청합니다. Claude가 페이지를 게시하고 해당 커넥터의 도구가 세션에서 사용 가능할 때, Claude Code는 페이지가 선언하는 도구 이름을 이들과 비교하고, 일치하지 않는 이름에 대해 Claude에게 경고하며, 일치하는 이름이 없을 때 게시를 거부합니다. v2.1.265 이전에는 이들을 확인하지 않고 페이지를 게시했습니다.

​
파일 다운로드 제공

아티팩트는 페이지가 생성하는 파일(예: 테이블의 CSV 내보내기 또는 차트의 PNG)을 뷰어에게 제공할 수 있습니다. 뷰어는 페이지의 다운로드 컨트롤(예: 버튼)을 통해 파일을 저장합니다. 파일 다운로드는 claude.ai가 계정별로 제공하는 런타임 기능이므로, Claude는 컨트롤을 구축하기 전에 계정�� 이 기능이 있는지 확인합니다. 뷰어는 일반 다운로드 링크나 페이지의 스크립트에서 파일을 저장할 수 없습니다. claude.ai의 아티팩트 뷰어는 페이지가 시작하는 모든 다운로드(예: data: 또는 blob: URL로의 링크)를 차단하기 때문입니다. 페이지에 이런 방식으로 구축된 다운로드 버튼이 있다면, Claude에게 다운로드 기능으로 다시 구축해 달라고 요청하세요. 파일을 제공하려면 프롬프트에서 컨트롤과 파일 형식을 요청하세요:
Claude는 커넥터를 선언하는 것과 같은 방식으로 게시의 일부로 다운로드 기능을 선언합니다.

​
빌드할 수 있는 것

아티팩트는 단일 HTML 페이지이므로 HTML, CSS 및 인라인 JavaScript로 표현할 수 있는 모든 것이 범위 내입니다. 아래 패턴이 가장 자주 나타납니다.

​
변경 사항 설명

diff 또는 디자인 변경을 관련 줄 옆에 주석과 함께 렌더링하는 페이지를 요청하여 검토자가 설명에서 재구성하는 대신 코드 옆에서 추론을 읽을 수 있도록 하십시오.

​
대안 비교

한 페이지에 여러 변형을 요청하여 서로 평가할 수 있도록 하십시오. 이는 레이아웃, 복사, API 모양 또는 구현 계획에 적합합니다.

​
인터랙티브 컨트롤로 조정

조정 중인 것에 바인딩된 슬라이더, 토글 또는 입력 필드를 요청하여 설명하는 대신 값을 직접 탐색할 수 있도록 하십시오.

​
결과를 세션으로 다시 가져오기

아티팩트는 Claude에 다시 전달하는 결정을 위한 경량 편집기로 작동할 수 있습니다. 페이지와 상호작용한 결과가 페이지에 남아 있는 대신 세션으로 흐르도록 터미널에 붙여넣을 수 있는 텍스트를 생성하는 내보내기 컨트롤을 요청하십시오.

​
진행 중인 작업 추적

Claude가 긴 작업이 실행되는 동안 아티팩트를 최신 상태로 유지하도록 요청하여 링크가 있는 모든 사람이 터미널을 읽지 않고도 따라갈 수 있도록 하십시오.

​
시각적 디자인 개선

Claude는 아티팩트를 빌드할 때 내장된 디자인 스킬을 적용하므로, 추가 프롬프트 없이도 페이지가 의도적인 팔레트, 타이포그래피 및 레이아웃을 얻습니다. 해당 스킬은 자신의 선택을 하기 전에 프로젝트의 기존 디자인 시스템을 찾습니다. 디자인 토큰은 디자인 시스템이 재사용하는 명명된 색상, 타이포그래피 및 간격 값입니다. 아티팩트를 제품의 브랜딩과 일치시키려면, Claude가 찾을 수 있는 위치(예: 프로젝트의 CLAUDE.md 또는 리포지토리의 테마 파일)에 기록하세요:
Claude는 디자인 시스템을 자신의 선택보다 높은 우선순위로 취급하며, 프롬프트를 둘 다보다 높은 우선순위로 취급합니다. 위의 제목과 형식은 예시이며, 색상, 글꼴 및 간격의 명확한 목록이면 모두 작동합니다. 타이포그래피의 경우, Claude는 Google Fonts에서 타입페이스를 로드할 수 있으며, 이는 아티팩트 페이지가 로드할 수 있는 유일한 외부 글꼴 소스입니다. Claude는 다른 모든 타입페이스를 @font-face 데이터 URI로 인라인하고 모든 타입페이스에 폴백 스택을 제공하므로, 글꼴이 로드되지 않아도 페이지가 여전히 렌더링됩니다. 특정 타입페이스를 사용하려면 프롬프트나 디자인 시스템에서 이름을 지정하세요.

​
슬라이드, 디자인 또는 문서 템플릿에서 시작하기

처음부터 페이지를 구축하는 대신 Claude는 claude.ai 계정의 템플릿 중 하나에서 아티팩트를 시작할 수 있습니다: 프레젠테이션을 위한 Claude Slides, 시각적 디자인을 위한 Claude Design, 또는 다른 사람들이 읽고 편집할 문서를 위한 Claude Docs. 각각은 claude.ai의 자체 편집기에서 열리며, 사용자와 팀원들이 직접 변경하거나 Claude에 요청할 수 있으며, PowerPoint, PDF 또는 Word와 같은 형식으로 내보낼 수 있습니다. 템플릿에서 시작하려면 “마이그레이션 노트를 목요일 검토를 위한 덱으로 변환하기” 또는 “이 계획을 팀을 위한 문서로 작성하기”와 같이 원하는 내용을 설명하세요. Claude는 일치하는 템플릿을 선택하고, 요청과 세션에 이미 있는 내용으로 채우며, 링크를 제공합니다. 덱 또는 디자인의 경우 간단한 설명과 함께 /slides 또는 /design을 실행할 수도 있습니다.
템플릿은 베타 버전입니다. Pro, Max, Ultra 및 Team 플랜에서는 기본적으로 활성화되어 있습니다. Enterprise 플랜에서는 Owner가 조직 설정 > 아티팩트 아래에서 각 템플릿을 활성화합니다. 조직에서 Slides 템플릿이 비활성화되어 있으면 /slides가 나타나지 않습니다. Design 템플릿이 비활성화되어 있으면 /design이 디자인을 초안 작성하지 않습니다. 두 명령 모두 Claude Code v2.1.265 이상과 아티팩트를 사용할 수 있는 세션이 필요합니다.

​
슬라이드 덱 만들기

덱이 다루는 내용과 대상을 설명하는 간단한 설명과 함께 /slides를 실행하세요:
Claude는 Claude Slides 아티팩트를 생성하고 링크를 제공합니다. 데스크톱 브라우저에서 열어 덱을 편집하거나 프레젠테이션하세요. 간단한 설명 없이 /slides를 실행하면 Claude는 덱이 무엇에 관한 것인지 묻고 나서 생성합니다.

​
디자인 캔버스 초안 작성

UI, 화면 흐름, 랜딩 페이지 또는 포스터를 구축하기보다는 목업하려면 간단한 설명과 함께 /design을 실행하세요. Claude는 디자인을 하나의 캔버스에 아트보드로 초안 작성하고 Claude Design 아티팩트로 캔버스를 게시합니다. 설명은 그려야 할 내용을 지정합니다:
게시된 아티팩트를 데스크톱 브라우저에서 열어 아트보드를 검토하세요. 아트보드의 요소를 선택하고 변경하면 편집 내용이 자동으로 저장됩니다. 각 아트보드를 PNG 또는 PDF로 내보낼 수 있습니다.

​
Claude Docs로 문서 작성하기

Claude Docs는 명령이 아닌 claude.ai 커넥터로 Claude Code에 도달합니다. 연결되면 /mcp는 이를 claude.ai Claude Docs로 나열합니다. 다른 사람들을 위한 문서에 대한 요청은 아티팩트 페이지 대신 Claude Docs로 이동합니다: 사양, 제안 또는 세션에서 작업한 계획의 작성. Claude는 초안이 작성되면 문서의 링크를 제공합니다. 코드베이스에 속하는 문서(예: README)는 파일로 유지됩니다. Claude가 Claude Docs에 넣을 것에 대한 파일을 얻으려면 .docx 또는 저장소의 Markdown 파일과 같은 형식을 지정하세요. claude.ai Claude Docs 커넥터만 끄려면 claude.ai 커넥터 비활성화를 참조하세요.

​
페이지 제약 사항

각 아티팩트는 하나의 자체 포함된 페이지입니다. Claude Code는 게시하는 파일을 HTML 문서 셸로 래핑하고 엄격한 콘텐츠 보안 정책(CSP)에 따라 제공하며, 이는 페이지가 수행할 수 있는 작업을 결정합니다. 아티팩트를 생성하면 다른 응답과 마찬가지로 출력 토큰을 사용하며, 스타일이 지정된 페이지는 동일한 콘텐츠를 터미널 텍스트로 표현하는 것보다 더 토큰 집약적입니다. 인라인 CSS, 대화형 컨트롤을 위한 JavaScript, 특히 데이터 URI로 임베드된 이미지가 주요 기여 요소입니다. 아티팩트의 토큰 비용을 줄이려면:
  • 임베드된 래스터 이미지보다 다이어그램에 SVG 또는 HTML 및 CSS를 선호합니다
  • 필요하지 않은 상호작용을 생략합니다
  • 페이지가 전체 인라인 대신 큰 데이터 세트를 요약하도록 합니다

​
가용성

Artifacts는 아래의 모든 조건을 충족해야 합니다. 하나라도 충족되지 않으면 Claude는 로컬 HTML 파일을 작성하거나 게시할 수 없다고 말합니다. 조직에서 artifacts가 허용되는지 여부는 Claude Code가 api.anthropic.com에서 로드하는 조직의 정책에서 나옵니다. Claude Code가 정책을 로드할 수 없으면 artifacts를 사용할 수 없습니다. 사용자가 요청하면 Claude가 그 이유를 설명합니다. 프록시, VPN 또는 웹 필터가 관련된 경우 IT 관리자에게 api.anthropic.com을 허용하도록 요청하십시오. Claude Code는 백그라운드에서 계속 재시도하며, 정책이 로드되고 이를 허용하면 artifacts를 사용할 수 있게 됩니다.

​
아티팩트 비활성화

조직의 설정에 관계없이 자신의 세션에 대해 아티팩트를 끄려면 다음 중 하나를 사용하십시오: --settings 파일에서 아티팩트를 끄거나 CLAUDE_CODE_DISABLE_ARTIFACT를 사용하거나, 관리자가 관리되는 설정에서 아티팩트를 끄면, 어떤 설정 파일도 아티팩트를 다시 켤 수 없습니다. 프로젝트의 .claude/settings.json 또는 .claude/settings.local.json에서 "enableArtifact": false를 설정하여 해당 프로젝트의 세션에 대해 아티팩트를 끌 수도 있습니다. 두 파일 중 하나에서 "enableArtifact": true를 설정해도 아티팩트를 다시 켜지 않습니다. 프로젝트 및 로컬 설정에서 키를 인식하려면 Claude Code v2.1.242 이상이 필요합니다. domain: 부분이 없는 WebFetch 거부 또는 요청 규칙을 추가하면 아티팩트를 끄거나 아티팩트 읽기를 차단하지 않습니다. deny 또는 ask의 WebFetch(domain:claude.ai) 규칙은 아티팩트 읽기에 적용됩니다.

​
조직의 아티팩트 관리

Team 및 Enterprise 플랜의 관리자는 claude.ai 관리 설정에서 아티팩트를 제어합니다. 아티팩트 콘텐츠는 Anthropic 운영 인프라에 저장되며 게시 조직의 인증된 구성원과 이를 공유하는 사람들에게만 표시됩니다. 아티팩트가 공개적으로 공유되지 않는 한 그렇습니다.

​
아티팩트 활성화 또는 비활성화

전체 조직에 대해 아티팩트를 활성화하거나 비활성화하려면 조직 설정 > 아티팩트로 이동하여 아티팩트 토글을 사용하십시오. 역할 기반 액세스 제어가 있는 Enterprise 플랜에서는 추가로 아티팩트를 특정 역할로 범위 지정할 수 있습니다. 조직 설정 > 역할로 이동하여 역할을 편집하고 아티팩트 권한을 설정하십시오.

​
아티팩트에서 커넥터 호출 제어

아티팩트에서의 커넥터 호출은 아티팩트를 켜거나 끄는 아티팩트 토글과 별도의 토글을 가지고 있습니다. 조직 설정 > 기능으로 이동하여 아티팩트 커넥터 활성화 토글을 사용하십시오. 동일한 토글은 claude.ai 대화에서 생성된 아티팩트의 커넥터 호출을 관리합니다.

​
공개 공유 제어

공개 공유는 Team 및 Enterprise 플랜에서 기본적으로 꺼져 있습니다. 구성원이 로그인 없이 누구나 볼 수 있는 공개 링크에 아티팩트를 게시할 수 있도록 하려면 조직 설정 > 아티팩트로 이동하여 아티팩트 토글 아래에서 외부 공유를 켜십시오. 다시 끄면 각 아티팩트의 대상을 변경하지 않고 기존 공개 링크를 통한 액세스를 차단합니다. 다시 활성화하면 액세스가 재개됩니다.

​
보존 정책 설정

아티팩트가 자동 삭제 전에 유지되는 기간을 설정하려면 조직 설정 > 데이터 및 개인정보 보호로 이동하십시오. 작성자에게만 비공개인 아티팩트와 공유된 아티팩트에 대해 별도의 보존 기간을 설정할 수 있습니다.

​
감사 로그 검토

아티팩트 게시, 공유 및 삭제는 각각 조직의 감사 로그에 claude_artifact_* 이벤트 유형 아래에 나타나며, 이는 claude.ai 대화에서 생성된 아티팩트에 사용되는 동일한 제품군입니다.

​
뷰어 도메인 허용 목록

claude.ai의 뷰어는 샌드박스된 *.claudeusercontent.com 원본에서 각 아티팩트를 로드합니다. 조직이 아웃바운드 네트워크 액세스를 제한하는 경우 claude.ai와 함께 해당 도메인을 허용 목록에 추가하십시오. 전체 목록은 네트워크 액세스 요구사항을 참조하십시오. Google Fonts에서 글꼴을 로드하는 아티팩트는 fonts.googleapis.com 및 fonts.gstatic.com도 요청합니다. 두 호스트 모두 선택 사항입니다. 이들을 차단하면 아티팩트는 대체 글꼴로 렌더링됩니다. 글꼴 요청이 페이지의 첫 렌더링을 지연시키는 대신 즉시 실패하도록 빠른 거부로 차단하십시오. 아티팩트는 또한 React 또는 차트 패키지와 같은 JavaScript 라이브러리�� cdnjs.cloudflare.com, cdn.jsdelivr.net, cdn.tailwindcss.com, code.jquery.com, unpkg.com에서 로드할 수 있으며 다른 외부 호스트에서는 로드할 수 없습니다. 이러한 호스트를 차단하면 라이브러리에 의존하는 아티팩트의 부분이 작동하지 않으며, 차단된 글꼴과 달리 차단된 라이브러리는 대체 기능이 없습니다. 차단된 라이브러리 요청이 시간 초과될 때까지 중단되는 대신 즉시 실패하도록 여기서도 빠른 거부로 차단하십시오.

​
Compliance API를 사용하여 아티팩트 나열 및 삭제

Compliance API는 조직의 아티팩트를 나열하고, 특정 버전의 콘텐츠를 검색하고, 아티팩트를 삭제하는 엔드포인트를 제공합니다: 요청 및 응답 스키마는 Compliance API 참조를 참조하십시오.
  • 아티팩트와 쌍을 이루는 프롬프팅 패턴 및 워크플로우 찾아보기
  • 재사용하는 아티팩트 프롬프트를 기술로 변환하여 명령으로 호출할 수 있도록 하기
  • MCP 서버 연결하여 Claude가 페이지를 구축하는 동안 아티팩트로 데이터를 가져올 수 있도록 하기