🧽 HTML 코드 포맷팅

HTML 코드를 태그 구조에 맞게 들여쓰기 정리합니다.

사용법

  1. HTML 코드를 입력하세요.
  2. '정리' 버튼을 누르세요.
  3. 태그 구조에 맞게 들여쓰기된 코드가 표시됩니다.

🎯 이럴 때 씁니다

입력 · 출력 예시

입력
<nav><a href="/">Home</a></nav>
출력
<nav>
  <a href="/">
    Home
  </a>
</nav>

한 줄로 붙어 있던 HTML을 태그 구조에 맞춰 2칸 들여쓰기로 정리하며, 텍스트와 속성(href="/")은 그대로 보존됩니다.

자주 묻는 질문

완전한 파서 기반인가요?
아니요. 태그 구조를 인식해 들여쓰기하는 경량 포맷터로, script·style·pre 태그 내용은 원문 그대로 보존합니다.
잘못된 HTML도 정리되나요?
닫히지 않은 태그 등 문법 오류가 있어도 최대한 정리를 시도하지만, 완전한 검증이 필요하면 HTML5 검증기를 함께 사용하세요.
입력한 코드가 서버로 전송되나요?
전송되지 않습니다. 브라우저 안에서만 처리됩니다.

다른 코딩 도구

📘
JSON 포맷터
JSON 정리·검증·압축
🗓️
타임스탬프 변환
유닉스 타임스탬프 ↔ 날짜 변환
🧩
JSON 인코딩·디코딩
텍스트 ↔ JSON 문자열 리터럴 변환
JavaScript/CSS 포맷팅
JS·CSS 코드 들여쓰기 정리
✂️
JavaScript/CSS 압축(Minify)
주석·공백 제거로 용량 줄이기
🧹
XML 포매팅
XML 태그 구조 들여쓰기 정리
🗃️
SQL 문 정렬
SQL 절 단위로 줄바꿈 정렬
🔣
HTML 엔티티 인코드·디코드
특수문자 ↔ HTML 엔티티 변환
📊
Excel → TABLE TAG 변환
엑셀 표를 HTML TABLE로 변환
⛓️
링크(href, src) 추출
HTML에서 href·src 링크 추출
🎨
컬러 피커
HEX·RGB·HSL 색상 코드 확인
🐘
PHP 구문 검사기
괄호·문자열 짝 검사(실용 검사기)
🗄️
MySQL 구문 검사기
괄호·따옴표 짝 검사(실용 검사기)
🔍
HTML5 검증기
태그 짝·중복id·alt누락 검사
✍️
온라인 HTML 에디터
시각적으로 HTML 작성·편집