UTILS.
100% 브라우저 내 실행
{ }

CSS 정리기

압축된 CSS를 적절한 줄바꿈과 간격으로 포맷하고 들여쓰기합니다.

— 여기에 결과가 표시됩니다 —

이 도구에 대하여

CSS 뷰티파이어는 압축되거나 지저분한 CSS를 깔끔하고 일관되게 들여쓴 형태로 바꿔 주는 무료 브라우저 내 포매터입니다. 먼저 기존 공백을 모두 접은 다음 구조를 처음부터 다시 세웁니다. 각 규칙과 선언은 자체 줄에 놓이고, 여는 중괄호는 선택자 줄에 남으며, 닫는 중괄호는 자체 줄로 내려가고, 중첩 블록은 단계마다 두 칸씩 들여씁니다.

선택자, 블록, 선언을 구분하는 구두점만을 기준으로 동작하여, 각 선언의 콜론 뒤에 한 칸, 여는 중괄호 앞에 한 칸을 추가합니다. 속성 이름과 값은 그대로 두므로 간격만 바뀌고 스타일링에는 영향이 없습니다. 서식은 입력하는 동안 실시간으로, 전적으로 브라우저 안에서 처리됩니다. 업로드도, 계정도, 추적도 없으며 오프라인에서도 작동합니다.

빌드 출력에서 가져온 압축 스타일시트를 읽거나 diff하거나 직접 손보아야 할 때, 또는 한 줄짜리 스니펫을 읽기 좋게 펼칠 때 유용합니다. CSS를 붙여 넣고 출력 상자에서 정리된 결과를 확인한 뒤 한 번의 클릭으로 복사하세요.

자주 묻는 질문

제 스타일이 바뀌나요?
아니요. 공백과 들여쓰기만 조정하며 속성 이름, 값, 선택자는 작성된 그대로 유지되므로 렌더링 결과는 동일합니다.
제 CSS가 어딘가로 전송되나요?
아니요. 서식은 JavaScript로 로컬에서 처리되며 업로드도, 계정도, 추적도 없어서 오프라인에서도 작동합니다.
압축된 CSS를 펼칠 수 있나요?
네. 먼저 기존 공백을 모두 접은 뒤 처음부터 다시 들여쓰므로, 한 줄로 압축된 CSS와 여러 줄로 널브러진 CSS 모두 동일하게 정돈된 결과를 냅니다.
CSS를 검증하거나 고쳐 주나요?
아니요. 중괄호, 세미콜론, 콜론 주변의 간격을 재정리할 뿐 CSS를 린트하거나 교정하지는 않으므로, 기존 문법 오류는 그대로 통과됩니다.

더 많은 도구