본문 바로가기

함께 만들어가는 공간

모아
로그인

코드 정리 · Beautifier (HTML·CSS·JS·PHP·Java·Kotlin·Python·SQL…)

HTML·CSS·JS·JSON·PHP·Java·Kotlin·Shell·Python·SQL·XML·YAML 코드를 탭이나 공백(2·4·8칸)으로 보기 좋게 정리하고, 복사하거나 색이 입혀진 HTML 로 내보냅니다. 코드는 서버로 보내지 않습니다.

"HTML 로 복사"는 색이 인라인 스타일로 입혀진 <pre><code> 조각이라 블로그·문서에 그대로 붙여도 색이 유지됩니다.

색상 미리보기

입력한 코드는 이 브라우저 안에서만 처리되며 서버로 보내지 않습니다. 정리는 공백·줄바꿈만 바꾸는 것이 원칙이지만, 중요한 코드는 정리 후 한 번 더 확인하세요.

정리 방식

  • HTML·CSS·JS·JSON 은 오픈소스 js-beautify(MIT)로, PHP·Java·Kotlin·Shell·Python·SQL·XML·YAML 은 이 사이트가 직접 만든 정리기로 처리합니다.
  • 직접 만든 정리기는 문자열·주석·숫자·식별자를 바꾸지 않고 토큰 사이의 공백과 줄바꿈만 바꿉니다. 두 번 정리해도 결과가 같도록(멱등) 만들었습니다.
  • 한 줄로 압축된 코드를 펼치는 데 맞춰져 있습니다. 줄 길이에 맞춰 코드를 다시 짜는 Prettier 같은 도구는 아닙니다.
  • 탭을 고르면 들여쓰기가 탭 문자로, 공백을 고르면 해당 칸 수로 바뀝니다. 파일로 저장하면 언어에 맞는 확장자(.php .kt .sh …)가 붙습니다.

자주 묻는 질문

입력한 코드가 서버로 전송되나요?

아닙니다. 모든 정리는 브라우저 안에서 이뤄집니다. 비밀번호나 키가 섞인 코드도 안심하고 붙여넣을 수 있습니다.

Python 은 왜 구조를 정리해 주지 않나요?

Python 은 들여쓰기가 문법이라 줄을 옮기거나 합치면 프로그램의 뜻이 달라집니다. 그래서 탭↔공백 변환과 공백 정리만 합니다.

정리했더니 코드가 깨졌어요.

문자열·주석 안은 바꾸지 않는 것이 원칙이지만 드문 문법에서 틀릴 수 있습니다. 문제가 되는 코드를 알려 주세요. 그동안은 원본을 보관해 두고 비교하세요.

HTML 로 복사는 어디에 쓰나요?

블로그·위키·메일처럼 코드 하이라이트 기능이 없는 곳에 색이 있는 코드를 붙일 때 씁니다. 스타일이 태그 안에 들어 있어 별도 CSS 가 필요 없습니다.

이 도구 사용 안내

들여쓰기가 엉망인 코드를 읽기 좋게 정리할 때 쓰세요. HTML·CSS·JavaScript·JSON·PHP·Java·Kotlin·Shell·Python·SQL·XML·YAML을 탭이나 공백(2·4·8칸)으로 정리하고 복사하거나 색이 입혀진 HTML로 내보냅니다. 코드는 서버로 보내지 않습니다.

자주 묻는 질문

어떤 언어를 정리할 수 있나요?

HTML·CSS·JavaScript·JSON·PHP·Java·Kotlin·Shell·Python·SQL·XML·YAML을 지원합니다.

들여쓰기를 고를 수 있나요?

네. 탭 또는 공백 2·4·8칸 중에서 고를 수 있습니다.

코드가 서버로 전송되나요?

아닙니다. 코드는 서버로 보내지 않고 브라우저에서 정리합니다.

모든 도구 보기

개발자 도구 모음

URL·Base64·HTML·유니코드 인코딩, JSON 정리·CSV 변환, 유닉스 시간, JWT 디코더, 해시, UUID, 정규식, 텍스트 비교, 진법·cron 해석, 표 변환, 서브넷(CIDR)·chmod 계산, HTTP·MIME·포트 사전, robots·sitemap, 더미 데이터, TOTP·semver·비트 연산·설정 파일(.env·INI·TOML) 변환·JSON 스키마 검증·docker run→compose·.gitignore·OG 태그 생성·ASCII/ANSI 코드표까지 40가지 개발 보조 도구를 한 곳에서.

코드 압축(Minify)

HTML·CSS·JS·JSON 의 주석과 불필요한 공백을 없애 용량을 줄입니다. 붙여넣거나 파일을 열고(끌어다 놓기 가능), 결과를 복사하거나 .min 파일로 내려받습니다. 코드는 서버로 보내지 않습니다.

JSON·XML·YAML 파서

JSON·XML·YAML 을 붙여넣거나 파일로 열면 문법을 검사하고(틀리면 몇 줄 몇 칸인지), 접고 펼치는 트리로 보여 주고, 값·키를 검색하고, 경로로 값을 찾고, 정리·압축하고, 서로 변환합니다. 모든 처리는 이 브라우저 안에서만 이뤄지며 입력과 파일은 서버로 보내지 않습니다.

CSS 생성기

그라디언트·그림자(box/text-shadow)·둥근 모서리(border-radius)·flex/grid 레이아웃을 눈으로 보며 만들고 CSS 를 복사합니다. 입력은 서버로 가지 않습니다.

비밀번호 생성기

길이와 문자 종류를 골라, 또는 외우기 쉬운 단어 조합(패스프레이즈)으로 추측하기 어려운 비밀번호를 만듭니다. 만든 값은 이 화면 밖으로 나가지 않습니다.

내 IP 확인

지금 접속한 공인 IP 주소와 대략적인 위치를 확인합니다.