ツールを実行
プレースホルダー画像生成ツールは、Webサイト制作やUIデザインのモックアップ作成、ワイヤーフレーム構築時に重宝するSVG形式のダミー画像を簡単に生成できるオンラインツールです。画像の幅と高さを1ピクセルから2000ピクセルの範囲で柔軟に指定でき、初期設定では400×300ピクセルの長方形画像が作成されます。画像中央に配置するテキストは任意のラベルや案内文を自由に入力可能で、未入力のまま実行した場合は「400×300」のように指定した寸法が自動的にレイアウトされます。さらに背景色（初期値 #cccccc）や文字色（初期値 #333333）もカラーコードで自由にカスタマイズできるため、制作中のWebページやアプリの配色テーマに合わせたダミー画像をすばやく準備できます。出力されたSVG画像やインライン画像データは、HTMLのimgタグやCSSの背景画像にそのまま埋め込んで即座に確認できます。
使い方
- 生成したい画像の幅と高さをピクセル単位で入力します（1から2000の範囲で指定可能、初期値は400×300）。
- 画像の中央に表示したいテキストを入力します。空欄のままにすると指定寸法が自動で表示されます。
- 背景色と文字色を16進数カラーコード（例: #cccccc、#333333）などで指定します。
- 生成を実行すると、指定した設定に応じたSVGプレースホルダー画像とインライン画像データが表示されます。
使用例
- 幅600、高さ400、テキスト「バナー枠」、背景色「#007acc」、文字色「#ffffff」を指定して、青色基調のバナー用ダミー画像を生成する。
- 幅150、高さ150を指定しテキストを空欄のままにして、中央に「150×150」と寸法が表示された正方形のサムネイル用画像を生成する。
よくある質問
テキストを入力しない場合はどのように表示されますか？
テキスト欄を空欄にした場合、指定した幅と高さを掛け算記号で結んだ文字列（例: 400×300）が自動的に中央へ表示されます。
指定できる画像サイズに制限はありますか？
幅と高さはそれぞれ最小1ピクセルから最大2000ピクセルまでの範囲で処理されます。範囲外の値を入力した場合は自動的にこの範囲内に調整されます。
特殊文字や記号を入力しても安全ですか？
入力されたテキストはSVG内に挿入される際に適切にエスケープ処理されるため、HTMLの特殊文字が含まれていても問題なく表示されます。