このツールについて

このダミー画像作成ツールは、任意の幅と高さで、背景色、文字色、ラベル(初期値は「幅×高さ」)を指定したプレースホルダー PNG を作成し、そのまま使える img タグも用意します。

使い方

  1. 幅と高さをピクセルで入力します。
  2. 背景色と文字色を選びます。
  3. 必要に応じて独自のラベルを入力します。
  4. PNG をダウンロードするか、img タグをコピーします。

知っておきたいこと

  • 画像は Canvas API で実寸のピクセルサイズで描画され、PNG として保存されます。
  • 対角線のガイドと中央のテキストにより、モックアップ内でプレースホルダーを見分けやすくなります。
  • img タグに width と height 属性を設定すると領域が確保され、レイアウトのずれを防げます。
  • ローカルで作るプレースホルダーなら、開発中に外部のプレースホルダーサービスに依存せずに済みます。

すべてブラウザ内で動作します。入力した内容がアップロード・保存されることはありません。

よくある質問

プレースホルダー画像を作るには?

サイズと色を入力して「PNG をダウンロード」をクリックすると、端末上で即座にファイルが作成されます。

プレースホルダーはどのサイズにすべきですか?

最終的な画像と同じサイズにしましょう。たとえば SNS のプレビューなら 1200 × 630、ヒーロー画像なら 1920 × 1080 にすると、レイアウトを正確に確認できます。

プレースホルダーの文字は変更できますか?

はい。好きなラベルを入力できます。空欄のままにすると、画像のサイズが表示されます。

インターネット接続や外部サービスは必要ですか?

いいえ。画像はブラウザ内でローカルに作成され、プレースホルダーサービスへのリクエストは発生しません。