🏞️ 画像プレースホルダー生成ツール

概要

このツールはブラウザのCanvas APIを使用して、指定したピクセル寸法の単色矩形をレンダリングし、中央揃えのテキストラベル（デフォルトは画像サイズ、例: 800×600）を重ねます。カラーピッカーで背景色とテキスト色を自由に選び、ラベルテキストを入力し、PNG・JPEG・WebPから出力形式を選択できます。結果はファイルとして保存するか、Base64データURIとしてコピーしてHTMLやCSSに直接埋め込めます。すべてクライアントサイドで動作するため、データはブラウザの外に出ず、アカウントやサーバーも不要です。

使い方

1. 希望する幅と高さをピクセル単位で入力してください（各最大4000 px）。
2. カラーピッカーで背景色とテキスト色を選択してください。
3. カスタムラベルを入力するか、空欄のままにすると画像サイズが自動表示されます。
4. 出力形式（PNG・JPEG・WebP）を選択して、ライブキャンバスプレビューを確認してください。
5. 「ダウンロード」をクリックして画像ファイルを保存するか、Base64データURIをコピーしてコードに直接埋め込んでください。

よくある質問

プレースホルダー画像とは何ですか？

プレースホルダー画像とは、実際の画像が用意される前にレイアウトスペースを確保するためにWeb・アプリ開発で使う一時的なグラフィックです。ワイヤーフレーム・プロトタイプ・HTMLテンプレートで広く使われています。

画像の最大サイズはありますか？

最大4000×4000ピクセルに対応しています。それを超えるとブラウザのキャンバスメモリ上限によりエラーになる場合があります。開発用途のほとんどでは4000 pxで十分です。

Base64データURIとは何ですか？いつ使うべきですか？

Base64データURIは画像をテキスト文字列としてエンコードしたもので、imgのsrc属性やCSSのbackground-image値に別ファイルなしで直接貼り付けられます。プロトタイプやメールに埋め込む小さな画像に最適です。

PNG・JPEG・WebPのどの出力形式を選べばよいですか？

ロスレス品質と透過対応が必要ならPNG、透過不要でファイルサイズを小さくしたいならJPEG、最新ブラウザでサイズと品質の最適なバランスを求めるならWebPを選んでください。

このツールはデータをサーバーにアップロードしますか？

いいえ。画像はCanvas APIを使ってブラウザ内のみで生成され、いかなるサーバーにも送信されません。ログイン・アップロード・データ収集は一切ありません。