Cookie の使用について.本サイトでは、基本機能の提供に必要な必須 Cookie を使用しています。さらに、同意いただいた場合に限り、アクセス解析 Cookie を利用して利用状況を把握し、サービス改善に役立てます。詳しくは .
Cookie の使用について.本サイトでは、基本機能の提供に必要な必須 Cookie を使用しています。さらに、同意いただいた場合に限り、アクセス解析 Cookie を利用して利用状況を把握し、サービス改善に役立てます。詳しくは .
このツールは使いやすかったですか？
フィードバックは改善に役立ちます
免费在线生成任意颜色和尺寸的纯色图片，支持下载 PNG/JPG 格式，适合占位图、背景制作。
色とサイズを設定すると、単色画像がプレビュー表示されます。
概要
解決できる課題、処理の仕組み、データの範囲を確認できます。
このツールは、選んだ色で長方形の画面全体を塗りつぶした画像を作ります。写真や模様を加工するのではなく、単色の背景素材やレイアウト確認用の色面を用意したいときに使います。幅と高さはそれぞれ1〜5000ピクセルで指定でき、横長・正方形・縦長など、必要な比率に合わせられます。
色コード欄で使えるのは、先頭に「#」を付けた3桁または6桁の16進RGB表記です。たとえば「#abc」は「#aabbcc」と同じ色です。W3CのCSS Color Module Level 3もこの短縮形と6桁形を定義しています。RGB関数、色名、透明度付きの8桁コードはこの欄では使えません。ツール内の色選択や色見本から選ぶ方法もあります。
幅と高さは物理的な印刷寸法ではなく、画像を構成するピクセル数です。たとえば1920×1080なら横長、1080×1080なら正方形です。比率は「幅÷高さ」で決まります。配置先に決まった枠がある場合は、先にその枠の比率に近い寸法を指定すると、後から余白を足したり切り抜いたりする手間を減らせます。
出力はPNG、JPG、WebPから選択できます。プレビューには生成結果と色・寸法・形式が表示され、画像ファイルの保存に加えて、色コードまたは画像データURLのコピーもできます。色面を一つ作る処理なので、外部データや色の検索結果を参照するものではありません。
使い方
手順に沿って操作し、例を使って入力と結果を確認します。
色選択欄、下の色見本、またはテキスト欄を使います。直接入力する場合は「#3b82f6」のような6桁、または「#abc」のような3桁のコードを入力します。
必要な横幅と縦幅をピクセル単位で指定します。よく使う比率なら、1920×1080、1280×720、800×600、600×400、1080×1080、750×1334のプリセットから選ぶこともできます。数値は各辺1〜5000の範囲です。
PNG・JPG・WebPを切り替え、プレビューと表示された寸法・色を確認します。入力欄に無効な色コードが残っていると、描画には黒が使われるため、意図した色かどうかも見てください。
ダウンロードで画像を保存します。色コードだけを再利用する場合は色コードをコピーし、別の場所で画像データとして扱う場合はデータURLをコピーします。データURLは画像ファイルそのものとは異なる長い文字列です。
活用例
仕事や日常の流れの中での活用方法を紹介します。
余計な写真を入れず文字を見せたいページ向けに、テーマ色とスライド枠に合うピクセル寸法で色面を用意します。仕上げる前に、実際のスライド上で文字との見やすさを確認してください。
画像がまだ決まっていない領域に置く仮素材として、表示枠に近い比率の単色画像を作れます。仮の色面を使う場合は、完成画像へ差し替える際に比率や切り抜き位置も再確認します。
特定のHEX色を一面にしたファイルが必要なとき、コードを入力して同じ色の矩形を出力できます。複数の色を比較するなら、色ごとにコードを変えて別々に保存します。
Q&A
よくある疑問や迷いやすい点をまとめて確認できます。
テキスト欄では使えません。「#f00」または「#ff0000」のように、#付きの3桁か6桁の16進コードを使うか、色選択欄から色を選んでください。
作れません。PNGを選んでもキャンバス全面が選択色で塗られた不透明画像になります。透過PNGや半透明オーバーレイが必要な場合は、透明度を指定できる画像編集機能を使ってください。
形式は用途に合わせて選びます。JPGとWebPはこのツールでは品質値0.92で出力され、PNGにはその品質指定を渡しません。形式によってファイルの見え方やサイズが変わることがあるため、提出先が形式を指定している場合はその条件を優先し、保存後のファイルを確認してください。
注意
利用範囲、結果の制限、必要な注意点を事前に確認します。
入力した色コードと画像のピクセル寸法は指定できますが、画面の色設定や表示環境によって見た目に差が出ることがあります。ブランド色の厳密な照合や印刷色の確認には、実際に使用するソフトや出力環境で最終ファイルを確認してください。また、このツールは均一な一色の長方形を作る機能です。グラデーション、模様、写真の背景置換、透明部分の作成には対応しません。
出力サイズは幅・高さそれぞれ最大5000ピクセルです。大きい寸法では端末やブラウザの処理能力により、生成や保存に時間がかかる場合があります。JPGやWebPの見た目を画素単位で保持したい素材には、出力後の画像も確認してください。
関連
関連ツール、特集、利用可能なAPIを探せます。