イラスト画像生成用
空状態・404向けスポットイラスト
「まだ何もありません」の画面に置く、小さなワンポイント。
用途・説明
検索結果が0件のとき、データが未登録のとき、404ページ、送信完了画面などに置く小さなイラストを生成するプロンプトです。主役はあくまでメッセージとボタンなので、モチーフは1つ、色数は少なく、背景は透過しやすい白に限定しています。
カラーを選ぶ
選んだ内容は、上の仕上がり例と下のプロンプト全文に反映されます。
カラー
書き換える項目
プロンプト内の［ ］の部分を、つくりたいサイトに合わせて書き換えてから使ってください。
[画面の状況]- 例：検索結果が見つからない／お気に入りがまだない／送信完了
[モチーフ]- 例：書類と虫めがね、空の箱、紙ひこうき
プロンプト全文
Small spot illustration for an app screen. Situation: [画面の状況] Subject: [モチーフ] Style: - Simple flat vector illustration, friendly and calm — not sad, not alarming - One main object only, built from basic rounded shapes - Palette of 3 colors: #1463F0, a pale tint of the same color, and deep navy (#1B2A44) for one small detail; plus white - A single soft circle in the pale tint sits behind the object as a backdrop - 2–4 tiny sparkles or dots around it for a light, positive mood - No outlines, no gradients, no shadows other than one thin flat ellipse under the object Composition: - Aspect ratio 1:1 - Pure white background (#FFFFFF) so it can be cut out or made transparent - Object centered, occupying about 50% of the frame - Must stay recognizable when displayed at 160px wide Avoid: - Text, numbers such as "404", logos or watermarks - Characters with sad or crying faces - Background scenery or multiple objects --- 日本語メモ（AIに渡す前に確認） - 上記は英語プロンプトです。画像生成AIは英語の方が意図通りに出力されやすいため英語で記載しています - 空状態のイラストは横幅120〜200pxで使うことが多いので、生成後に縮小して判別できるか確認してください - イラストは装飾扱いにして alt="" とし、状況の説明はテキストで別に書くのがおすすめです
使い方
- 1「書き換える項目」を見ながら、プロンプト内の［ ］の部分を描きたい内容に書き換えます。色はこのページ上で選ぶと、プロンプトに自動で反映されます。
- 2「プロンプトをコピー」を押し、画像を生成できるAI（ChatGPT・Geminiなど）にそのまま貼り付けて送信します。
- 3生成された画像を確認し、「人物を1人に」「色数を減らして」のように続けて伝えて調整します。商用利用の可否は、お使いのAIサービスの利用規約をご確認ください。