プレースホルダー画像
このダミー画像作成ツールは、任意の幅と高さで、背景色、文字色、ラベル(初期値は「幅×高さ」)を指定したプレースホルダー PNG を作成し、そのまま使える img タグも用意します。
このツールについて
このダミー画像作成ツールは、任意の幅と高さで、背景色、文字色、ラベル(初期値は「幅×高さ」)を指定したプレースホルダー PNG を作成し、そのまま使える img タグも用意します。
使い方
- 幅と高さをピクセルで入力します。
- 背景色と文字色を選びます。
- 必要に応じて独自のラベルを入力します。
- PNG をダウンロードするか、img タグをコピーします。
知っておきたいこと
- 画像は Canvas API で実寸のピクセルサイズで描画され、PNG として保存されます。
- 対角線のガイドと中央のテキストにより、モックアップ内でプレースホルダーを見分けやすくなります。
- img タグに width と height 属性を設定すると領域が確保され、レイアウトのずれを防げます。
- ローカルで作るプレースホルダーなら、開発中に外部のプレースホルダーサービスに依存せずに済みます。
すべてブラウザ内で動作します。入力した内容がアップロード・保存されることはありません。
よくある質問
プレースホルダー画像を作るには?
サイズと色を入力して「PNG をダウンロード」をクリックすると、端末上で即座にファイルが作成されます。
プレースホルダーはどのサイズにすべきですか?
最終的な画像と同じサイズにしましょう。たとえば SNS のプレビューなら 1200 × 630、ヒーロー画像なら 1920 × 1080 にすると、レイアウトを正確に確認できます。
プレースホルダーの文字は変更できますか?
はい。好きなラベルを入力できます。空欄のままにすると、画像のサイズが表示されます。
インターネット接続や外部サービスは必要ですか?
いいえ。画像はブラウザ内でローカルに作成され、プレースホルダーサービスへのリクエストは発生しません。