CSS 포매터 및 압축기
CSS를 다시 읽기 쉽게 만들거나, 더 빠른 사이트를 위해 작게 줄이세요.
CSS 포매터·압축기 사용 방법
CSS 붙여넣기
스타일시트를 붙여넣거나 .css 파일을 열거나 끌어다 놓으세요. 입력하는 대로 바로 정리됩니다.
정리 또는 압축
보기 좋게 정리는 각 규칙과 속성을 한 줄씩 나눕니다. 압축은 주석, 공백 등 브라우저에 필요 없는 것을 모두 지웁니다.
복사 또는 다운로드
결과를 복사하거나 .css 파일로 다운로드하세요. 압축하면 전후 크기를 볼 수 있습니다.
Utils365를 선택해야 하는 이유
공백 제거 그 이상
#ff0000을 red로 바꾸는 등 색상을 줄이고, 0의 단위를 빼고, 빈 규칙도 지웁니다.
규칙 순서 유지
규칙을 합치거나 옮기지 않으므로 캐스케이드가 이전과 똑같이 동작하고 예상치 못한 덮어쓰기가 생기지 않습니다.
라이선스 주석 유지
/*!로 시작하는 주석은 많은 오픈 소스 라이선스가 요구하는 대로 압축된 파일에도 남습니다.
안전한 프라이버시
CSS는 브라우저에서 정리되고 절대 업로드되지 않습니다.
자주 묻는 질문
압축하면 CSS가 얼마나 작아지나요?
보통 15–30%이며, 주석이 많은 스타일시트라면 더 줄어듭니다. 요약에 정확한 전후 크기와 줄어든 비율이 표시됩니다.
압축하면 스타일이 깨질 수 있나요?
그렇지 않도록 설계되었습니다. 값은 같은 의미가 되는 방식으로만 바꾸고 규칙 순서도 유지하므로, 어떤 규칙이 우선하는지는 바뀌지 않습니다.
압축된 CSS를 되돌리려면?
압축된 CSS를 붙여넣고 보기 좋게 정리를 선택하세요. 모든 규칙과 속성이 고른 들여쓰기로 한 줄씩 나뉩니다. 지워진 주석은 되살릴 수 없습니다.
SCSS나 Less에도 쓸 수 있나요?
보기 좋게 정리는 중첩을 포함해 대부분의 SCSS와 Less를 처리합니다. 압축은 일반 CSS를 기준으로 하므로 SCSS나 Less는 먼저 컴파일하세요.