English

clip-path ジェネレーター

CSSの clip-path をドラッグ操作で直感的に作成。多角形・円・楕円・inset と定番形状に対応し、-webkit- 付きのコードをワンクリックでコピーできます。

頂点をドラッグで移動/プレビューをダブルクリックで追加/頂点をダブルクリックで削除

生成されたCSS

対象の要素に class="clip-path" を付けて貼り付けてください。-webkit-clip-path は古いブラウザ互換のために併記しています。