プレビュー
用途別プリセット
幅 (px)
高さ (px)
フォーマット
背景色
文字色
表示テキスト (任意・未入力時はサイズ表示)
HTMLタグコード（Base64埋め込み）
Base64コード
Webサイト制作やアプリ開発のレイアウト確認に使えるダミー画像（プレースホルダー）を、ブラウザ上で直感的に作成・ダウンロードできる無料ツールです。
集客できるコンテンツ作りに！検索数の多いキーワードを調べる
このツールでできること
- プリセットによる簡単サイズ指定：OGP画像、X（旧Twitter）、Instagram、YouTubeサムネイルなどの頻出サイズをワンクリックで設定できます。
- 自由なカスタマイズ：1pxから4000pxまでの任意のサイズ、背景色、文字色、任意のテキストを指定可能です。
- 多彩なフォーマット出力：PNG、JPG、WebP、SVGの4種類のファイル形式に対応しています。
- Base64コードの即時生成：画像をダウンロードせずに、HTMLに直接埋め込めるimgタグやBase64コードをワンクリックでコピーできます。
このツールの使い方
- サイズの指定：「用途別プリセット」から選択するか、「幅」と「高さ」の数値を直接入力します。
- デザインの調整：保存したい「フォーマット」を選び、カラーピッカーまたはHEXコード（#から始まる6桁の英数字）で「背景色」と「文字色」を指定します。
- テキストの入力：画像の中央に表示させたい文字がある場合は、「表示テキスト」に入力します（未入力の場合は画像サイズが表示されます）。
- 保存・コピー：プレビューを確認し、「ダミー画像をダウンロード」ボタンを押して画像を保存するか、ページ下部の「HTMLタグコード」「Base64コード」をコピーして利用してください。
このツールで取得する情報の基礎知識
- ダミー画像（プレースホルダー）とは
本番用の画像が準備できるまでの間、レイアウトの崩れを防いだり、デザインの全体像を確認したりするために一時的に配置しておく仮の画像のことです。 - Base64コードとは
画像などのデータを、一定のルールに基づいて文字列（テキスト）に変換したものです。この文字列をHTMLファイルなどに直接記述することで、サーバーへの通信回数を減らし、ページの表示速度を改善する効果が期待できます。
このツールが役立つときはどんなとき？ ユースケースは？
- Webデザイン・コーディング時：ワイヤーフレームやモックアップを作成する際、仮の画像を配置してレイアウトを確認したいとき。
- SNS運用の準備：XやInstagram、ブログのOGP画像など、推奨サイズに合わせた画像がどのような見え方になるかテストしたいとき。
- システム開発のテスト：プログラム開発中に、ダミーのユーザーアイコンやサムネイル画像として大量のテストデータが必要なとき。
適切な画像フォーマットの選び方
出力する形式に迷った場合は、用途に合わせて以下を参考にしてください。
SVG：拡大・縮小しても画質が劣化しないベクター画像です。レスポンシブデザインのテストに最適です。
PNG：図形や文字がくっきりと表示されます。ダミー画像として最も汎用性の高い形式です。
JPG：ファイルサイズを抑えたい場合に適しています。
WebP：画質を保ちながらファイルサイズを劇的に軽くできる、近年のWeb標準フォーマットです。
SVG：拡大・縮小しても画質が劣化しないベクター画像です。レスポンシブデザインのテストに最適です。
