CSS 포맷터 & 미니파이어

브라우저 기반의 CSS 도구로, 지저분한 CSS를 적절한 들여쓰기로 정리하거나, 주석, 공백 및 불필요한 문자를 제거하여 프로덕션용으로 최소화할 수 있습니다. 실시간으로 절감되는 크기를 보여줍니다.

이 CSS 포맷터를 사용하는 이유는 무엇인가요?

• 포맷 또는 최소화 — 하나의 도구에 두 가지 모드.
• 주석 제거 — 최소화 도구가 모든 CSS 주석을 자동으로 제거합니다.
• 크기 통계 — 입력/출력 크기와 절감된 비율을 한눈에 확인하세요.
• 의존성 없음 — 완전히 브라우저에서 실행됩니다.

주요 기능

• 스마트 들여쓰기: 들여쓰기는 { / } 중첩 깊이를 2칸 탭으로 추적합니다.
• 속성 분할: 각 선언은 ; 후에 자체 줄을 가집니다.
• 주석 제거: 최소화 도구는 모든 /* */ 블록 주석을 제거합니다.
• 공백 압축: 여러 공백을 축소하고 {};:, 주변의 공백을 제거합니다.

작동 방식

포맷터는 CSS를 문자 단위로 순회합니다:
{
는 들여쓰기를 증가시키고 새 줄을 시작하며,
}
는 들여쓰기를 감소시키고,
;
는 줄바꿈을 트리거합니다. 최소화 도구는 정규식을 사용하여 주석을 제거하고, 공백을 축소하며, 구조적 문자 주변의 공백을 제거합니다.

CSS 포맷터 사용해 보기

CSS를 붙여넣고, “포맷” 또는 “최소화”를 클릭한 후 결과를 복사하세요.