Claude 아티팩트를 HTML 파일로 내려받고 링크로 공유하는 방법

Claude로 퀴즈, 계산기, 한 페이지짜리 사이트를 만들었고, 이제 파일이 필요해요. 보관하거나, 보내거나, 호스팅 서비스에 올리려고요. 무엇을 저장할 수 있는지는 아티팩트를 어떻게 만들었는지에 따라 달라요. 이 글에서는 종류별로 하나씩 살펴보고, 코드를 어느 브라우저에서나 열리는 .html 파일로 만드는 방법과, 파일이 Claude를 떠나면 동작하지 않는 것을 정리해요.

코드가 이미 있나요? 이 페이지 맨 위의 업로드 상자에 붙여 넣으세요. 계정 없이 미리보기 링크가 생겨요. 이 미리보기에서는 스크립트가 실행되지 않아요. ‘이 페이지 보관하기’(무료, 카드 필요 없음)를 누르고 가입하면 페이지가 내 계정으로 옮겨지고, 거기서 스크립트가 실행돼요.

아티팩트 종류별로 저장할 수 있는 것

Anthropic의 아티팩트 도움말에 따르면 아티팩트는 Free, Pro, Max, Team, Enterprise 플랜에서 쓸 수 있고, 코드 실행과 파일 생성을 켜야 해요(Free, Pro, Max는 ‘설정 > 기능’, Team과 Enterprise는 ‘조직 설정 > 기능’). 파일을 꺼내는 방법은 2가지를 설명해요.

• 템플릿으로 만든 아티팩트. ‘내보내기’를 클릭하세요. 도움말에 따르면 문서는 Word, PDF, Markdown, Google Docs로, 덱은 PowerPoint와 PDF로, 디자인은 .zip, PDF, PowerPoint, 독립 실행형 HTML로, 애니메이션은 MP4 비디오로 내보낼 수 있어요.
• 레거시 아티팩트. 2026년 9월 16일 이전에 채팅에서 만든 아티팩트예요. 도움말은 “아티팩트 패널 상단의 컨트롤을 사용하여 코드를 보거나, 콘텐츠를 복사하거나, 다운로드하세요”라고 안내해요.

지금 채팅에서 템플릿 없이 요청한 아티팩트에는 도움말이 다운로드 컨트롤을 말하지 않아요. Claude에게 페이지를 HTML 파일 하나로 달라고 하고, 답변에서 코드를 복사하세요. Anthropic의 Claude로 파일 생성 및 편집 도움말은 Claude가 만들어 내려받게 해 주는 파일로 Excel, PowerPoint, Word, PDF를 들고, HTML은 들지 않아요.

표의 출처는 Anthropic의 아티팩트 도움말, 파일 생성 도움말, Claude Code의 아티팩트 문서이고, 2026년 10월 23일에 한국어판을 읽었어요. Claude Code에서는 위치를 지정하지 않으면 “Claude는 프로젝트 외부의 임시 디렉터리에 있는 HTML 또는 Markdown 파일에 페이지를 작성”한다고 문서에 적혀 있어요. Claude Code에게 내 폴더에 사본을 저장해 달라고 하세요.

Claude Design 페이지라면 내보낸 독립 실행형 HTML을 그대로 올리세요. 그 파일은 Claude Design 웹사이트를 게시하는 방법(영어)에서 다뤄요.

코드를 .html 파일로 저장하는 4단계

이 단계는 코드를 복사할 수 있는 아티팩트라면 어떤 것에도 통해요. 레거시 아티팩트나, Claude가 채팅에 써 준 페이지예요.

1. Claude에게 HTML 파일 하나를 달라고 하기

같은 채팅에 이렇게 붙여 넣으세요.

아티팩트로 만들지 말고, 답변 안에 코드 블록 하나로 넣어 주세요.
이 아티팩트를 <!DOCTYPE html>부터 </html>까지 완전한 HTML 파일 하나로 주세요.
CSS와 JavaScript를 모두 파일 안에 넣어 주세요.
React 컴포넌트라면 빌드 단계 없이 일반 HTML과 JavaScript로 다시 써 주세요.
Claude를 호출하거나, 연결된 앱을 쓰거나, Claude의 저장소에 데이터를 저장하는 부분은 모두 빼 주세요.

마지막 줄이 중요한 이유는 그 기능들이 Claude 안에서만 동작하기 때문이에요. 자세한 이유는 Claude 밖에서 동작하지 않는 것 섹션에서 설명해요.

2. 코드를 전부 복사하기

답변의 코드 블록을 처음의 <!DOCTYPE html>부터 마지막 </html>까지 모두 복사하세요. 중간에 잘린 페이지는 깨지거나 빈 화면으로 보여요.

3. .html로 끝나는 일반 텍스트 파일로 저장하기

Windows의 메모장이나 Mac의 텍스트 편집기 같은 일반 텍스트 편집기를 열고, 코드를 붙여 넣은 뒤 quiz.html 같은 이름으로 저장하세요. 이름이 .html.txt가 아니라 .html로 끝나는지 확인하세요.

Mac에서는 Apple의 텍스트 편집기 사용 설명서가 단계를 알려 줘요. ‘파일 > 신규’를 선택한 다음 ‘포맷 > 일반 텍스트 만들기’를 선택하세요. 코드를 붙여 넣고 ‘파일 > 저장’을 선택한 뒤 .html로 끝나는 이름을 입력하세요. 사용할 확장자를 물으면 ‘.html 사용’을 클릭하세요.

4. 브라우저에서 열기

파일을 더블클릭하세요. 컴퓨터의 브라우저에서 열려요. 한 번 끝까지 눌러 보세요. 버튼을 누르고, 탭을 열고, 퀴즈를 끝까지 풀어 보세요. 빠진 것이 있으면 보내기 전에 다음 섹션을 보세요.

먼저 컴퓨터와 휴대폰에서 열어 보기

Convika는 2026년 10월 21일에 시험 파일 3개를 폴더에서 바로 Chromium으로 열어 봤어요.

• HTML 파일 하나로 쓴 페이지는 스크립트가 그린 제목과 버튼을 보여 줬어요.
• .html로 저장한 React 컴포넌트는 자기 코드를 글자로 보여 줬고, 버튼이 하나 있었지만 아무 동작도 하지 않았어요. 브라우저는 빌드 단계 없이 그런 React 코드를 실행할 수 없으니, 1단계처럼 Claude에게 일반 HTML을 달라고 하세요.
• Claude의 저장소로 데이터를 읽는 페이지는 빈 화면을 보여 줬어요. 폴더에서 연 파일에는 저장소가 없어서, 스크립트가 처음 저장소를 부르는 곳에서 멈췄어요.

아이폰의 파일 앱에서 .html 파일을 탭하면 미리보기가 열려요. Convika의 iOS 26.3 시험에서 이 미리보기는 JavaScript를 실행하지 않아서, 퀴즈나 게임이 반응하지 않아요. 내 파일을 휴대폰에서 시험하려면 휴대폰 브라우저에서 Convika의 무료 HTML 뷰어를 열고 ‘HTML 파일 선택’을 탭하세요. 파일은 브라우저가 읽고, 업로드되지 않아요. 시험 내용 전체는 아이폰에서 HTML 파일을 여는 방법에 있어요.

Claude 로그인 없이 링크로 공유하기

Claude의 ‘공유’ 버튼은 claude.ai 링크를 줘요. Anthropic의 아티팩트 공유 도움말에는 “모든 사람이 Claude 계정이 필요합니다. 계정이 없는 사람은 링크가 있어도 공유된 아티팩트를 열 수 없습니다. 유일한 예외는 채팅에서 게시된 레거시 아티팩트입니다.”라고 적혀 있어요. Claude Code의 아티팩트 문서는 claude.ai 로그인 없이 열리는 공개 링크를 더해요. ‘링크가 있는 누구나’로 공유하는 기능은 Pro, Max, Team, Enterprise 플랜에 있어요. 레거시 채팅 아티팩트 게시는 Free, Pro, Max에 있어요.

저장한 파일에는 그런 규칙이 없어요. 호스팅 서비스에 올리면 누구나 브라우저에서 그 주소를 열어요. Convika에서는 이렇게 해요.

1. 이 페이지 맨 위의 업로드 상자에 파일을 놓거나 코드를 붙여 넣으세요. 계정 없이 미리보기 링크가 생겨요. 이 링크는 3분 동안 열리고, 스크립트와 폼은 꺼져 있어요.
2. ‘이 페이지 보관하기’(무료, 카드 필요 없음)를 누르고 가입하세요. 페이지가 내 계정으로 옮겨지고, 대시보드 미리보기에서 스크립트가 실행돼요.
3. ‘게시하기’를 누르세요. ‘누가 이 페이지를 열 수 있나요?’에서 ‘전체 공개’를 고르고 ‘다음’을 누르세요. 처음 게시할 때는 요금제가 나오고, ‘Pro 월간’이 선택되어 있어요(카드를 등록하면 1일 무료, 그 뒤 월 $12). 나머지 둘은 ‘Pro 1년 패스’($29, 한 번 결제, 자동 갱신 없음)와 ‘무료’($0, Convika 배너가 붙어요)예요. 무료로 게시하려면 ‘무료’를 고르고 ‘무료로 게시하기’를 누르세요. Pro 월간과 1년 패스에는 Convika 배너가 붙지 않아요.
4. yourpage.convika.page 같은 주소를 복사해서 채팅이나 메일로 보내거나, QR 코드를 보여 주세요.

무료 요금제에서는 페이지가 ‘전체 공개’로 게시돼요. 링크가 있는 사람은 누구나 열 수 있고, 검색 결과와 Convika 갤러리에 나올 수도 있어요. 둘 다에서 빼려면 게시할 때 ‘누가 이 페이지를 열 수 있나요?’에서 ‘일부 공개’(Pro 또는 1년 패스)를 고르세요. 일부 공개 링크도 링크가 있는 사람은 누구나 열 수 있어요.

무료 요금제에는 모든 페이지를 합쳐 한 달 페이지뷰 10,000회가 들어 있고, 대시보드에서 페이지를 몇 명이 열었는지 볼 수 있어요. 요금제마다 무엇이 들어 있는지는 요금제에 있어요. 응답이 저장되는 폼과 내 도메인을 붙이는 방법은 Claude 아티팩트를 웹사이트로 게시하는 방법에서 다뤄요. 링크와 메일 첨부를 비교한 글은 Claude에서 HTML 파일을 공유하는 방법(영어)이에요. 학생들에게 Claude 계정이 없는 교사라면 학생에게 Claude 아티팩트를 공유하는 방법(영어)을 따라 하세요.

Claude 밖에서 동작하지 않는 것

• Claude를 쓰는 기능. Anthropic의 아티팩트 도움말에 따르면 Claude를 부르는 아티팩트는 “앱이 Anthropic의 인프라에서 실행”되고, 쓰는 사람은 자기 Claude 계정으로 로그인해요. 저장한 파일에서는 그 호출에 답해 줄 곳이 없어요.
• 연결된 앱. Asana, Google Calendar, Slack을 읽는 아티팩트는 Claude의 커넥터로 그 일을 해요. 저장한 파일은 그렇게 할 수 없어요.
• Claude의 저장소. Pro, Max, Team, Enterprise의 아티팩트는 세션 사이에 데이터를 저장할 수 있어요. 그 데이터는 Claude 안에 남고, 그 데이터를 기다리는 페이지는 Convika의 시험에서처럼 빈 화면을 보여 줄 수 있어요.
• React 컴포넌트. 저장하기 전에 Claude에게 코드를 일반 HTML과 JavaScript로 다시 써 달라고 하세요.
• 페이지 옆에 있는 파일. HTML 파일 옆에 photo.png로 저장한 그림은 파일 하나와 함께 옮겨지지 않아요. Claude에게 이미지는 https://로 시작하는 전체 링크를 쓰라고 하세요.
• 무료 요금제 Convika 페이지에서 다른 사이트 호출. 무료 요금제 Convika 페이지에서는 스크립트의 fetch·XHR 요청이 페이지 자신의 주소에만 닿아서, 다른 사이트의 API에서 데이터를 가져오는 아티팩트는 아무것도 받지 못해요. Pro에서는 Convika가 지원하는 분석 도구와 내 광고 네트워크용으로 등록한 호스트가 더해져요.

Convika는 .html과 .htm 파일을 2 MB까지, 페이지 하나에 파일 하나로 받아요.

자주 묻는 질문

Claude 아티팩트를 HTML로 내려받으려면 어떻게 하나요?

아티팩트 종류에 따라 달라요. Design 템플릿으로 만든 디자인은 ‘내보내기’에서 독립 실행형 HTML로 내보낼 수 있어요. 2026년 9월 16일 이전에 채팅에서 만든 레거시 아티팩트는 패널 상단에 코드를 보고, 복사하고, 다운로드하는 컨트롤이 있어요. 그 밖의 아티팩트는 같은 채팅에서 Claude에게 페이지를 완전한 HTML 파일 하나로 달라고 한 뒤, 코드를 복사해 .html로 끝나는 파일로 저장하세요.

아티팩트를 HTML 파일로 저장하려면 어떻게 하나요?

CSS와 JavaScript를 안에 넣은 완전한 HTML 파일 하나를 Claude에게 달라고 하고, 코드를 전부 복사하세요. 메모장이나, ‘포맷 > 일반 텍스트 만들기’를 선택한 텍스트 편집기 같은 일반 텍스트 편집기에 붙여 넣고, page.html 같은 이름으로 저장하세요. 보내기 전에 파일을 더블클릭해서 브라우저에서 확인하세요.

Claude 없이 Claude 아티팩트를 열 수 있나요?

네, 코드를 HTML 파일로 저장하거나 그 파일을 호스팅 서비스에 게시하면 돼요. 페이지는 어느 브라우저에서나 열려요. Claude를 부르거나 연결된 앱을 읽는 부분은 Claude 안에서 동작하기 때문에 멈춰요. Claude의 저장소에 데이터를 저장하는 부분도 멈추지만, 같은 저장소 호출을 제공하는 Convika 페이지(영어)에서는 예외예요(window.storage). Claude의 ‘공유’ 링크 자체는 Claude에 로그인한 사람만 열 수 있어요. 예외는 ‘게시’로 게시한 레거시 채팅 아티팩트와, Claude Code 문서에 따르면 공개로 공유한 Claude Code 아티팩트예요.

계정이 없는 사람에게 Claude 아티팩트를 공유하려면 어떻게 하나요?

claude.ai 링크 대신 호스팅한 페이지 사본의 링크를 보내세요. 아티팩트의 코드를 HTML 파일로 저장하고 호스팅 서비스에 올리세요. Convika에서는 업로드 상자가 계정 없이 미리보기 링크를 만들어 주고, 이 링크에서는 스크립트가 꺼져 있어요. 페이지를 무료 요금제로 보관하고 게시하면, 누구나 Claude나 Convika 계정 없이 브라우저에서 그 주소를 열어요.

내려받은 아티팩트가 빈 페이지로 보이는 이유는 무엇인가요?

가장 흔한 원인은 React 컴포넌트처럼 완전한 HTML 페이지가 아닌 코드, 그리고 Claude의 저장소나 Claude 호출처럼 저장한 파일에는 없는 것을 기다리는 페이지예요. Convika의 시험에서 Claude의 저장소를 읽는 페이지는 빈 화면을 보여 줬고, React 컴포넌트는 자기 코드를 글자로 보여 줬어요. 그런 기능을 뺀 일반 HTML을 Claude에게 달라고 하세요. 아이폰의 미리보기에서 연 파일도 스크립트를 실행하지 않아서 멈춘 것처럼 보일 수 있어요.

출처

• 아티팩트란 무엇이며 어떻게 사용하나요? (Anthropic) (2026년 10월 23일 한국어판 확인)
• 아티팩트 공유 (Anthropic) (2026년 10월 23일 한국어판 확인)
• Claude로 파일 생성 및 편집 (Anthropic) (2026년 10월 23일 한국어판 확인)
• 아티팩트 (Claude Code 문서) (2026년 10월 23일 한국어판 확인)
• Mac용 텍스트 편집기에서 HTML 문서로 작업하기 (Apple) (2026년 10월 23일 한국어판 확인)