CSS Clip-Path クリッピングパスジェネレーター

ソフトウェア使用方法

1. 切り抜きパスを設計：ツールに入ったら、まず「パスを設計」ステップで形状タイプを選択します。多角形、円、楕円、インセット矩形を使用できます。
2. プリセット形状を選択：基本図形、矢印とアイコン、装飾図形からプリセットを選び、必要に応じてパラメータを調整できます。
3. パスパラメータを編集：多角形は制御点をドラッグでき、座標テキストボックスにパーセント座標を入力することもできます。円、楕円、インセット矩形は半径、中心点、余白、角丸を直接入力できます。
4. プレビュー効果を設定：プレビューの幅と高さ、グラデーション色、グラデーション角度を調整でき、画像をプレビュー内容として選択することもできます。
5. CSSコードをコピー：効果を確認したら「clip-pathをコピー」または「CSSをコピー」をクリックします。-webkitプレフィックスとクラスセレクタを含めるか選択できます。
6. 画像を一括処理：「次へ：一括処理」をクリックし、複数の画像を選択して、出力形式、品質、サイズモードを設定してから処理を開始します。
7. 結果をダウンロード：処理完了後に「すべての結果をZIPでダウンロード」をクリックします。出力ファイルはできるだけ元のファイル名を引き継ぎ、同名の場合は自動的に数字を追加して区別します。

よくある質問