CSS를 깔끔한 들여쓰기로 보기 좋게 만들거나 파일 크기를 줄이기 위해 압축합니다. 미디어 쿼리, calc(), 라이선스 주석을 처리합니다.
CSS 포맷터 사용 방법
CSS를 입력 상자에 붙여넣으세요.
보기 좋게를 선택하여 형식화하거나 압축을 선택하여 압축하세요.
들여쓰기 크기를 선택하고 결과를 복사하세요.
This is a CSS formatter that beautifies stylesheets with clean, consistent indentation, or minifies them to shrink file size. You choose the indent size for beautifying, and switch to minify when you want the smallest output.
Readable CSS is easier to scan, review and debug: when each rule and declaration is indented consistently, you can see selectors, nesting and the shape of your media queries at a glance.
Minifying is for production. It removes the whitespace and comments that browsers do not need, so the file downloads faster. On a large stylesheet the saving adds up, especially before gzip compression on the server.
The minifier is careful where it matters. It keeps the spaces around plus and minus inside calc(), so calc(100% - 30px) stays valid, and it only strips spaces around structural characters such as braces, colons and semicolons. It also handles nested media queries correctly.
License comments written in the /*! ... */ form are preserved, which is the standard convention for keeping copyright and license notices in minified output even when ordinary comments are removed.
Both beautify and minify run entirely in your browser, so your stylesheets never leave your device. The tool formats for readability and size; it does not validate that your CSS is correct.
자주 묻는 질문
아니요. 압축기는 값 내부의 더하기 및 빼기 주변 공백을 유지하므로 calc(100% - 30px)가 유효하게 유지됩니다. 중괄호, 콜론, 세미콜론 같은 구조적 문자 주변의 공백만 제거합니다.
공간을 절약하기 위해 일반 주석은 제거되지만, /*! ... */로 작성된 라이선스 주석은 저작권 표시를 보존하는 표준 관례에 따라 유지됩니다.
아니요. 보기 좋게 만들기와 압축 모두 브라우저에서 완전히 실행되므로 스타일시트가 기기 밖으로 나가지 않습니다.
이 도구 임베드하기
이 도구를 직접 운영하는 웹사이트에 추가하세요. 아래 코드를 복사하면 자동으로 최신 상태로 유지됩니다.
<iframe src="https://monu.tools/embed/ko/css-formatter" width="100%" height="640" style="border:1px solid #e5e5e5;border-radius:12px;max-width:680px" loading="lazy" title="Monu Tools"></iframe>관련 도구