input.html

<!doctype html><html><head><title>Demo</title><style>body{font-family:sans-serif;margin:2rem}h1{color:#2d6cdf}</style></head><body><h1>Hello, world</h1><p>This HTML is <strong>rendered</strong> locally — nothing is uploaded.</p><ul><li>One</li><li>Two</li></ul></body></html>

preview

HTML을 붙여넣으면 브라우저에서 안전하게 렌더링하여 미리 봅니다.

HTML 뷰어 가이드

전체 가이드 →

가이드

JSON 파싱 오류: 메시지를 읽고, 해결로 바로 이동

JSON 파서 오류 메시지와 각각을 설명하는 문서의 디렉터리 —— 먼저 엄격한 검증기로 확인하고, 그다음 구체적인 구문 문제로 파고듭니다.

가이드

잘못된 JSON 수정: '무엇이 잘못됐는지'에서 깨끗한 파일로

거의 맞아 보이는 JSON 복구 —— 후행 쉼표, 작은따옴표, 따옴표 없는 키 —— '거의 JSON'을 허용하는 스마트 포매터를 사용한 뒤 엄격하게 검증합니다.

가이드

JSON 포매터, 검증기, 뷰어: 알맞은 도구 고르기

포매터, 검증기, 뷰어, 압축기, 비교를 나란히 비교하고, API 페이로드를 검토할 때 이들을 연결하는 순서를 제시합니다.

온라인 HTML 뷰어 & 렌더러

왼쪽에 HTML 을 붙여 넣으면 오른쪽에서 즉시 렌더링된 모습을 볼 수 있습니다. 이 온라인 HTML 뷰어는 전적으로 브라우저 안에서 동작합니다 —— 마크업은 절대 서버로 업로드되지 않으므로 내부 페이지, 이메일 템플릿, 작업 중인 마크업에 안전합니다.

미리보기는 스크립트가 비활성화된 샌드박스 프레임에서 렌더링되므로, JavaScript 를 실행하지 않고도 브라우저가 배치하는 그대로 HTML 과 CSS 를 볼 수 있습니다. 작업하는 동안 Format 버튼을 사용하면 소스를 깔끔한 들여쓰기로 보기 좋게 출력할 수 있습니다.

HTML 보기 —— 마크업을 붙여 넣고 렌더링된 결과를 읽습니다, 온라인 HTML 리더처럼
HTML & CSS 렌더링 —— 인라인 <style> 과 속성이 미리보기에 적용됩니다
소스 포맷 —— 지저분한 HTML 을 한 번의 클릭으로 다시 들여씁니다
100% 로컬 —— 비공개 HTML 뷰어, 아무것도 브라우저를 떠나지 않습니다

무엇을 미리볼 수 있나요

이 도구는 온라인 HTML 뷰어, HTML 파일 뷰어, HTML 미리보기 도구, HTML 렌더러 역할을 합니다 : 전체 문서나 일부 조각을 붙여 넣으면 프레임이 그 모습을 보여 줍니다. 이메일 HTML, 내보낸 보고서, 스크래핑한 조각, 컴포넌트 마크업 모두 브라우저가 그리는 방식 그대로 렌더링됩니다.

스크립트가 비활성화된 이유

임의의 JavaScript 를 실행하는 뷰어는 여러분이 붙여 넣은 바로 그 데이터를 유출할 수 있습니다. 스크립트를 비활성화하면 도구가 안전하고 예측 가능하게 유지됩니다 —— 구조와 스타일링에 대한 충실한 시각적 미리보기를 얻을 수 있습니다. 인터랙티브한 동작을 테스트하려면 대신 실제 브라우저 탭에서 HTML 을 여세요.

FAQ

내 HTML 이 어딘가로 업로드되나요?

아니요. 뷰어는 샌드박스 iframe 안에서 HTML 을 로컬로 렌더링합니다. 아무것도 서버로 전송되지 않으므로 기밀 마크업에도 안전합니다.

왜 미리보기에서 내 JavaScript 가 실행되지 않나요?

미리보기 프레임은 보안을 위해 스크립트가 비활성화된 샌드박스입니다. 렌더링된 HTML 과 CSS 는 보이지만 <script> 코드는 실행되지 않습니다. 스크립트를 테스트하려면 브라우저에서 파일을 여세요.

HTML 도 포맷할 수 있나요?

네 —— Format 을 클릭하면 소스를 일관된 간격으로 다시 들여씁니다. 전용 도구가 필요하다면 HTML 포매터를 참고하세요.