CSS 정리·압축
한 줄로 뭉친 CSS를 보기 좋게 들여쓰기하거나, 반대로 미니파이해 한 줄로 만듭니다. @media 쿼리·중첩 규칙·주석을 모두 처리합니다.
입력 CSS
결과
사용 방법
1
모드 선택
"정리(Beautify)" 또는 "압축(Minify)"을 탭으로 선택하세요. 정리는 들여쓰기 추가, 압축은 공백·줄바꿈 제거입니다.
2
CSS 입력
왼쪽에 CSS 코드를 붙여넣으세요. 결과가 오른쪽에 실시간으로 표시됩니다.
3
옵션 조절·복사
들여쓰기 폭(2칸·4칸·탭)을 선택할 수 있고, 압축 모드에서는 "주석 제거" 옵션도 사용 가능합니다.
자주 묻는 질문
@media 쿼리도 정리되나요?
네. @media·@supports·@keyframes·@font-face 등 중첩 규칙도 들여쓰기 깊이에 맞춰 정리됩니다. 중괄호 깊이를 추적해 들여쓰기를 자동 계산합니다.
주석은 어떻게?
정리 모드에서는 주석이 보존되어 적절한 위치에 표시됩니다. 압축 모드에서는 "주석 제거" 옵션이 켜진 경우(기본값) 모두 제거되고, 끄면 보존됩니다.
CSS minify 시 어떤 최적화가 적용?
본 도구는 1) 주석 제거 2) 연속 공백 단일화 3) 구두점({} :;,) 주변 공백 제거 4) 마지막 세미콜론 제거를 적용합니다. "0px → 0", "#ffffff → #fff" 같은 값 최적화는 적용하지 않습니다(원본 정확성 우선).
잘못된 CSS도 처리되나요?
본 도구는 단순 토큰 기반 포매터로, 닫는 중괄호가 빠지거나 문법이 잘못된 CSS도 처리는 합니다(들여쓰기 깊이가 어긋날 수 있음). 정확한 검증은 W3C CSS Validator를 사용하세요.
데이터가 서버에 전송되나요?
아닙니다. 모든 변환은 브라우저에서만 이루어지며, 입력한 CSS가 외부로 전송되지 않습니다.
