UTILS.
기본부터 지키는 개인정보
◇

CSS clip-path 생성기

요소를 다양한 도형으로 잘라내고 clip-path CSS를 복사하세요.

파일은 이 기기에만 남습니다

파일은 브라우저에서 처리되며 업로드되지 않습니다. 사이트는 도구 실행에 필요한 코드와 리소스를 다운로드합니다. 계정이나 추적은 없습니다.

다운로드를 눌러 이 도구를 하나의 HTML 파일로 저장하고 오프라인으로 사용하세요.

개인정보 →

이 도구에 대하여

도형을 선택하면 그에 맞는 clip-path 규칙으로 미리보기 박스가 즉시 잘립니다. 바로 사용할 수 있는 CSS를 복사하세요. 미리보기는 전적으로 브라우저 안에서 실시간으로 업데이트됩니다.

자주 묻는 질문

폴리곤 clip-path는 어떻게 동작하나요?
각 점은 박스를 기준으로 한 x y 백분율 쌍입니다. 브라우저가 이 점들을 순서대로 연결하고, 윤곽선 안쪽 영역만 표시합니다.
모든 브라우저가 clip-path를 지원하나요?
폴리곤, 원, 타원, inset 도형은 모든 최신 브라우저에서 지원되므로 생성된 CSS는 접두사 없이 동작합니다.

더 많은 도구