Utilz
CSS 포맷터
CSS 코드를 정리하거나 압축하세요
이 도구를 사용하는 이유
- 복잡한 CSS를 깔끔하고 읽기 쉬운 스타일시트로 즉시 정리합니다.
- CSS를 압축하여 프로덕션 배포 시 파일 크기를 줄일 수 있습니다.
- 서버 처리 없이 브라우저에서 완전히 동작합니다.
사용 방법
- CSS 코드를 입력 영역에 붙여넣으세요
- 원하는 들여쓰기 크기(2 또는 4칸)를 선택하세요
- 포맷팅된 CSS가 오른쪽에 자동으로 표시됩니다
- 압축 버튼으로 프로덕션용 CSS를 생성할 수 있습니다
FAQ
SCSS 같은 중첩 CSS를 처리하나요?
이 도구는 표준 CSS를 포맷팅합니다. SCSS나 Less 같은 전처리기의 중첩 CSS는 먼저 컴파일해야 합니다. 단, 네이티브 CSS 중첩은 올바르게 처리됩니다.
CSS 주석을 제거하나요?
네. 포맷팅 과정에서 CSS 주석(/* ... */)을 제거하여 깔끔한 출력을 생성합니다. 원본 입력은 보존됩니다.
CSS를 압축할 수 있나요?
네. 압축 버튼을 클릭하면 모든 공백을 제거하여 프로덕션에 적합한 압축된 CSS를 생성합니다.
미디어 쿼리를 처리하나요?
네. 미디어 쿼리, 키프레임 애니메이션 등 중첩 블록이 있는 at-rule도 올바른 들여쓰기로 포맷팅됩니다.