HTML 온라인 실행
HTML/CSS/JS를 작성하고 결과를 바로 확인하세요. 코드는 브라우저에서만 실행되며 업로드되지 않습니다.
코드
미리보기 팁: 실행을 클릭하거나 자동 실행을 켜세요.
온라인 HTML 실행 도구란
왼쪽 편집기에 HTML, CSS, JavaScript를 붙여넣으면 오른쪽에 실제 페이지가 렌더링됩니다. 코드 검증과 스타일 디버깅에 유용합니다.
사용 방법
세 단계: ① 왼쪽에 코드 입력 ② 실행 클릭(또는 자동 실행) ③ 오른쪽에서 결과 확인 후 복사 또는 .html로 다운로드.
지원 기능
HTML5 시맨틱 태그, CSS3(Flexbox/Grid/애니메이션/미디어 쿼리), 최신 JavaScript(ES6+)를 지원합니다.
로컬 편집기와의 차이
로컬 편집기는 설치와 저장이 필요하지만, 이 도구는 페이지를 열자마자 사용할 수 있습니다. 대규모 개발에는 로컬 편집기를 권장합니다.
자주 묻는 질문
온라인에서 HTML을 실행해도 안전한가요? 코드가 업로드되나요?
안전합니다. 코드는 브라우저에서만 실행되며 서버로 전송되지 않습니다. 미리보기는 sandbox 속성이 있는 iframe을 사용하므로 사이트의 쿠키나 로컬 스토리지에 접근할 수 없습니다.
JavaScript를 지원하나요?
네. DOM 조작, 이벤트 리스너, 타이머를 포함한 최신 JavaScript(ES6+)가 동작합니다.
외부 CDN 라이브러리를 쓸 수 있나요?
<script src="...">로 사용할 수 있습니다. 다만 개인정보 보호를 위해 일부 기능은 sandbox로 제한됩니다.
로컬에서는 되는데 여기서는 안 되는 이유는?
흔한 원인: ① sandbox에서 차단된 기능 사용 ② 로컬 파일 의존 ③ 브라우저 콘솔 오류를 확인하세요.
코드를 저장할 수 있나요?
클립보드에 복사하거나 HTML 다운로드로 .html 파일로 저장할 수 있습니다. 서버에는 저장되지 않습니다.
모바일 브라우저를 지원하나요?
네. 모바일에서는 편집기와 미리보기가 세로로 배치되며 미리보기는 전체 화면이 가능합니다.
CodePen과 다른 점은?
CodePen은 커뮤니티와 호스팅을 제공합니다. 이 도구는 설치 없이 완전 로컬로 실행하는 데 집중합니다.
미리보기가 실제 브라우저와 동일한가요?
렌더링 엔진이 같아 거의 동일합니다. 차이는 sandbox 제한, 외부 리소스, 미리보기 크기입니다.