사용방법
- 입력 창에 CSS를 붙여넣으세요.
- "압축 (Minify)"을 클릭하여 용량을 줄이거나, "정렬 (Beautify)"을 클릭하여 가독성을 높이세요.
- 압축 통계(원본/압축 후/절약 비율)를 확인하세요.
- 출력된 결과를 복사하여 프로젝트에 적용하세요.
핵심 기능
- 주석 및 공백 제거: 주석, 줄바꿈, 불필요한 공백을 제거하여 CSS 용량을 빠르게 줄입니다.
- 용량 압축률 통계: 원본 크기, 압축 후 크기 및 절약된 비율을 표시하여 최적화 효과를 쉽게 확인할 수 있습니다.
- CSS 코드 정렬(Beautify): 압축된 CSS에 들여쓰기와 줄바꿈을 추가하여 읽기 쉬운 형태로 복원합니다.
- 안전한 무손실 압축: 스타일 동작을 변경하지 않고 공백과 주석만 안전하게 제거합니다.
- 로컬 개인정보 보호: 코드가 업로드되지 않아 사내 프로젝트 및 상용 코드에도 안전하게 사용할 수 있습니다.
관련 도구
CSS 및 UI 디자인을 위해 PX를 REM으로, 또는 REM을 PX로 변환합니다. 기본 폰트 크기 변경, 실시간 참조표, Tailwind 간격 토큰을 확인해 보세요.
안전한 JSON 포매터: 브라우저 로컬에서 JSON을 포맷팅, 유효성 검사 및 수정하세요. 압축, 에러 강조, TypeScript/Zod 자동 생성, XML 변환 등 모든 기능이 안전하게 처리됩니다.
API JSON을 위한 무료 JSONPath 테스터 및 평가 도구입니다. 실시간으로 매칭되는 노드를 추출하고 경로를 확인하세요. 파싱과 쿼리는 모두 브라우저에서 안전하게 로컬로 실행됩니다.
브라우저 로컬에서 JSON 객체 또는 배열을 CSV로 변환합니다. 중첩된 필드를 평면화하고, 결과를 미리 본 후 데이터 업로드 없이 복사하거나 다운로드하세요.
브라우저 로컬에서 CSV 텍스트나 파일을 JSON 배열로 실시간 변환하세요. 헤더, 쉼표/세미콜론/탭 구분자, 파일 드래그 앤 드롭, 복사 및 다운로드를 지원하며 데이터가 업로드되지 않습니다.
브라우저 로컬 환경에서 두 JSON 문서를 비교하세요. 객체의 키를 정렬하여 시맨틱 비교(Semantic Diff)를 수행하며, 키 순서로 인한 노이즈를 방지하고 추가, 삭제, 수정된 필드를 시각적으로 표시합니다. 데이터는 업로드되지 않습니다.
서식이 지정된 JSON을 한 줄로 압축하고, 들여쓰기와 줄바꿈을 제거합니다. 원본 크기, 압축 크기, 절약된 바이트 및 절약 비율을 실시간으로 비교하세요.
무료 JSON to TypeScript 변환 도구입니다. API 페이로드에서 TypeScript 인터페이스와 타입을 즉시 생성하세요. 서버 전송 없이 100% 클라이언트 측에서 안전하게 처리됩니다.
계산 논리
- 압축:
/*...*/주석을 제거하고 줄바꿈과 불필요한 공백을 안전하게 줄입니다. - 정렬: 중괄호와 선언문 주위에 줄바꿈과 들여쓰기를 추가하여 구조를 복원합니다.
- 통계: 출력된 결과의 바이트 크기를 기반으로 절약 비율을 계산합니다.
FAQ
CSS를 압축하면 SEO에 도움이 되나요?
대체로 도움이 됩니다. CSS 용량이 작아지면 로딩 속도가 빨라지고 FCP와 같은 코어 웹 바이탈(Core Web Vitals) 지표가 개선되어 간접적으로 SEO에 긍정적인 영향을 줄 수 있습니다.
압축된 CSS 코드는 어떻게 읽나요?
"정렬 (Beautify)" 기능을 사용하세요. 들여쓰기와 줄바꿈을 추가하여 사람이 읽기 쉬운 구조로 복원해 줍니다.
데이터는 안전한가요? 서버에 업로드되나요?
아니요. 모든 처리는 브라우저 로컬에서 완료되며 코드를 업로드하거나 저장하지 않습니다.
무료인가요? 코드 길이에 제한이 있나요?
무료로 이용 가능합니다. 매우 긴 CSS의 경우 브라우저 성능 유지를 위해 구간을 나누어 처리하는 것을 권장합니다.
CSS 압축 시 스타일이 변경될 수 있나요?
일반적인 CSS의 경우 공백과 주석 제거는 안전하게(Lossless) 이루어집니다. 다만, 비정상적인 구문 분석 동작에 의존하는 특이한 코드가 있다면 적용 전 테스트하는 것이 좋습니다.