Skip to content
🔧

CSS Clip-Path 생성기

생성기 및 디자인 · 무료 온라인 도구

경로를 시각적으로 그려 clip-path 생성.

CoderNewbie 팀

Presets

clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
-webkit-clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);

9가지 프리셋

삼각형, 육각형, 별, 화살표, 메시지 등을 한 번의 클릭으로.

Webkit 접두사

생성된 CSS는 Safari 호환성을 위해 -webkit-clip-path를 포함합니다.

사용자 정의 편집기

사용자 정의 모드로 전환하여 다각형 좌표를 직접 붙여넣거나 편집합니다.

CSS Clip-Path 생성기 사용 방법

  1. 1Configure the generator settings (colors, size, format, etc.).
  2. 2Enter any required input text or data.
  3. 3Click generate to create the output.
  4. 4Download or copy the generated result.

주요 기능

  • 100% 무료 — 가입, 구독, 광고 없음
  • 브라우저에서만 실행 — 데이터는 기기를 떠나지 않습니다
  • 빠르고 가벼움 — 즉시 결과 확인
  • 크로스 플랫폼 — 데스크톱, 태블릿, 모바일 지원

자주 묻는 질문

Can I use the generated content commercially?

Yes, all generated content (QR codes, gradients, colors) is free for personal and commercial use.

What output formats are available?

QR codes can be downloaded as PNG or SVG. Gradients generate CSS code. Colors output in HEX, RGB, and HSL.

관련 도구