cropimagekit

ImageCropKitは、スクリーンショット、AIデータセット、パスポートやプロフィール写真などを対象としたブラウザベースの画像切り抜きプラットフォームです。READMEでは、すべての処理がローカルで行われるため、アップロード、サインアップ、透かしが一切ないことが強調されています。 主な機能は以下の通りです： - 自由切り抜き、アスペクト比プリセット、正確なピクセル指定による単一画像の切り抜き。 - プライベートなキャプチャをアップロードしたくないユーザー向けの、空白やエッジのトリミングを含むスクリーンショットの切り抜きとトリミング。 - SD 1.5 (512x512) や SDXL (1024x1024) などのバッチ切り抜きプリセット、およびカスタムサイズによるAIデータセットの準備。 - パスポート、ヘッドショット、アバター、プロフィール写真の切り抜き。 - 一括切り抜き：複数の画像をアップロードし、共通の切り抜きを適用して結果をZIP形式でダウンロード。 - Instagram、TikTok、YouTube、Shopify、Amazon、Etsy、LinkedIn、およびパスポート写真をカバーするプラットフォームプリセット。 - アバターやプロフィール写真向けの円形および楕円形のシェイプ切り抜き。 - 品質管理が可能なPNG、JPG、WebP形式での書き出し。 動作仕組み：ユーザーがドラッグ＆ドロップ、クリック、または貼り付けで画像をアップロードし、切り抜き領域またはアスペクト比プリセットを選択して領域を調整し、書き出します。READMEによると、画像処理はHTML5 Canvas APIを使用してブラウザ内で実行されるため、サーバーへのアップロード、アカウント作成、透かしは不要です。 技術スタック：App RouterとTurbopackを備えたNext.js 16、TypeScriptを用いたReact 19、Tailwind CSS 4、画像処理用のCanvas API、切り抜きUI用のreact-image-crop、および一括ダウンロード用のJSZipとfile-saverを使用しています。開発にはpnpm（pnpm install, pnpm devの後、localhost:3000で動作）が利用されます。 プロジェクト構造では、appディレクトリがツールごとに1ページとして構成されており、crop-image、crop-screenshot、trim-screenshot、ai-dataset-cropper、profile-photo-cropper、bulk-crop-images、crop-product-images、crop-image-for-instagram、crop-image-for-tiktok、crop-headshot、circle-crop-imageが含まれます。再利用可能なコンポーネントには、単一画像エディタ用のCropEditor.tsx、複数画像エディタ用のBulkCropEditor.tsx、JSON-LD構造化データ用のStructuredData.tsxがあります。libディレクトリには、Canvasベースの書き出しパイプラインであるcropImage.ts、プラットフォームサイズプリセットのpresets.ts、siteConfig.tsなどのユーティリティ関数が格納されています。 Issueを通じた貢献が歓迎されており、プロジェクトはMITライセンスの下でリリースされています。READMEからライブサイトへのリンクが提供されています。