매일 손이 가는 개발자 도구를 한곳에.

변환기, 포맷터, 해시, 검증기, 그리고 계속 다시 열게 되는 작은 유틸리티들이 여러 탭에 흩어지지 않고 한자리에 모여 있습니다.

/ 도구

■

/ 도구 찾기

도구 109개

/ CSS 포매터/압축기

CSS 입력

/ 선택한 도구

■

CSS 포매터/압축기 - 무료 포맷터 도구

CSS 스타일시트를 포맷하거나 압축합니다

■ 01

CSS란?

CSS(Cascading Style Sheets)는 HTML 문서의 표현을 기술하는 데 쓰이는 스타일시트 언어입니다. 웹 페이지의 레이아웃, 색상, 폰트, 전반적인 시각적 외관을 제어합니다.

■ 02

어떻게 작동하나요?

포맷팅은 CSS 규칙을 파싱해 일관된 들여쓰기, 중괄호와 세미콜론 뒤의 줄바꿈, 선택자 주변 간격을 추가합니다. 압축(minify)은 반대로 주석을 제거하고, 공백을 압축하며, 불필요한 요소를 없앱니다…

■ 03

예시 사례

단순 CSS 규칙, 여러 선택자, 주석 포함을 다루므로 일반적인 입력과 출력을 빠르게 비교할 수 있습니다.

/ 관련 도구

/ 코드

■

선택한 도구의 소스 코드로, 오른쪽의 실시간 버전과 함께 여기에 표시됩니다.

/ 소스 코드

TypeScript

typescript

// No external dependencies needed - uses built-in string manipulation

function formatCss(css: string): string {
  if (!css.trim()) return '';

  let formatted = css;

  // Remove comments
  formatted = formatted.replace(/\/\*[\s\S]*?\*\//g, '');