自撮りからレトロアバター
設定
横幅: 56ピクセル パレット: 自動 (16色) ディザリング: あり 書き出し: 16x PNG
顔は目が読み取れるぎりぎりの解像度で十分。自動パレットは肌の色味を自然に保ちつつ、少ない色数がクラシックなピクセルポートレートの味を出します。
画像ドット絵変換
レトロパレットやディザリング、グリッド付きで写真をドット絵に変換できます。
最終更新
Ready to actually learn to code?
Coddy teaches you by writing real code in your browser - interactive lessons, instant feedback, and AI help when you get stuck.
画像ドット絵変換ツールとは?
画像ドット絵変換ツールは、普通の写真やイラストをドット絵(ピクセルアート)に変えます。画像を小さなブロックのグリッドに縮小し、色をコンパクトなパレットにまとめ、硬くシャープなエッジのまま拡大し直します。なめらかな写真が、レトロなゲーム風グラフィックになります。
仕組みは2つのアイデアです。*縮小*は写真の各領域を平均して1ピクセルにまとめます。幅は8〜128ピクセルから選べます。*減色(量子化)*は各ピクセルをパレットの最も近い色へ割り当てます。元の色を残す、ツールに最適なN色を自動で選ばせる、あるいは16色・32色・緑LCD・モノクロのパレットでレトロ感を強制する。オプションのディザリングは隣り合う色を市松模様に混ぜます。昔のゲーム機がグラデーションに使ったのと同じ技です。
すべてブラウザ内でローカルに動作し、画像はどこにもアップロードされません。アバターやプロフィール画像、ゲームアセットの下書き、8ビット風ポスターに。グリッドをオンにすれば、アイロンビーズやクロスステッチ、ブロックゲームの図案としても使えます。ワンクリックで結果をドット絵メーカーに送り、ピクセル単位で編集できます。
画像を変換しながら学べること
- 解像度は情報です。幅32ピクセルでは顔は気配にすぎず、96なら見分けられます。スライダーを動かすと、圧縮で何のディテールが生き残るかがわかります。
- 減色は、写真の何百万色を最も近い色を選んで小さなパレットへ写します。GIF エンコードや昔のディスプレイと同じ考え方です。
- ディザリングは、パレットの2色を交互に並べて中間色を擬似的に作ります。レトロゲームが16色で夕焼けを描けた理由です。
写真をドット絵にする手順
画像をドロップ
ドロップゾーンをクリックするか、PNG・JPG・WebP・SVG をドラッグします。画像は端末に残ったまま。変換はすべてブラウザ内で行われます。
横幅のピクセル数を選ぶ
8〜128ピクセルの間でスライド。少ないほどカクカクで抽象的、多いほどディテールが残ります。ポートレートは48〜96がだいたい最適です。
パレットとディザリングを選ぶ
「オリジナル」は写真の色をそのまま。「自動」はその画像に最適なN色を選びます。レトロパレットはクラシックなゲームの見た目に。携帯ゲーム機の雰囲気なら緑LCDを。グラデーションをなめらかにしたいときはディザリングをオンに。
書き出す
最大32倍スケールの PNG をダウンロード。組み立て用の図案が欲しければ先にピクセルグリッドをオンに。仕上げをしたければ結果をドット絵メーカーへ送りましょう。
設定クイックリファレンス
よくある変換の出発点。
| 目的 | 横幅(ピクセル) | パレット |
|---|---|---|
| プロフィール画像 / アバター | 48-64 | 自動、16-32色、ディザリングあり |
| ゲームアセットの下書き | 16-32 | レトロ16 または レトロ32、ディザリングなし |
| レトロ携帯機の見た目 | 64-96 | 緑LCD、ディザリングあり |
| ポスター / 壁紙のベース | 96-128 | 自動、32-64色、ディザリングあり |
| ビーズ / クロスステッチ図案 | 24-48 | 少なめの色の自動、グリッドあり |
| ミニマルアート | 16-32 | モノ、ディザリングあり |
試してみたい変換
携帯ゲーム機のスクリーンショット風
設定
横幅: 80ピクセル パレット: 緑LCD (4) ディザリング: あり 書き出し: 8x PNG
緑4階調とディザリングの組み合わせは、一目であの携帯機の美学だとわかります。パレットの明度は4段階しかないため、コントラストの強い写真ほどきれいに変換されます。
ビーズ・クロスステッチ図案
設定
横幅: 32ピクセル パレット: 自動 (8-12色) ディザリング: なし ピクセルグリッド: あり 書き出し: 16x PNG
ディザリングを切れば各領域がビーズや糸に対応させやすい単色になります。グリッド付きで書き出せば、1マスが置くべき1粒・1目になります。
よくある変換の失敗
- ごちゃごちゃした写真を幅16ピクセルで変換してポートレートを期待する。超低解像度はシンプルで高コントラストな被写体向き。先にぐっとトリミングを。
- グラデーションでディザリングを切る。空や肌が硬い色の帯に割れてしまいます。
- 「レトロ」のつもりで64色使う。当時のハードは4〜32色。制約こそがスタイルです。
画像ドット絵変換 FAQ
画像をドット絵に変換するには?
画像をアップロードし、結果の横幅ピクセル数とパレットを選び、PNG をダウンロードするだけ。変換ツールが写真をグリッドに縮小し、各ピクセルをパレットに合わせ、スムージングなしのシャープなエッジで書き出します。
写真からドット絵にする最適な設定は?
たいていの写真は、横幅48〜64ピクセル、自動パレット16色、ディザリングありが目安です。アイコン風なら16〜32ピクセルへ、ブロック感よりディテール重視なら96〜128へ。
ディザリングとは?
パレットの2色を細かい模様で交互に置き、目に中間色として混ぜさせる技法です。そのままでは縞になるグラデーションをなめらかにします。クラシックなゲーム機や GIF と同じ手法です。ビーズ図案などベタ塗りの面が欲しいときはオフにしましょう。
パレットは何をする?
「オリジナル」は縮小後の写真の色をすべて残します。「自動」は画像を分析して最も代表的なN色を選びます(メディアンカット)。レトロ16とレトロ32はクラシックなドット絵パレットに、緑LCDは4階調の携帯機ルックに、モノはグレースケールにします。
ビーズやブロックで組み立てる図案は作れる?
作れます。ピクセルグリッドをオンにすると、プレビューにも書き出した PNG にも各マスの枠線が入ります。アイロンビーズ、クロスステッチ、モザイク、ブロック建築ゲームにそのまま使える図案になります。
結果をピクセル単位で編集できる?
できます。「ドット絵メーカーで編集」を押すと、変換したグリッドがそのままドット絵メーカーに渡ります。はみ出したピクセルの修正、塗り替え、描き足し、さらにフレームアニメまで可能です。
画像ビューアで見るとぼやけるのはなぜ?
ビューアによってはズーム時にスムージングがかかります。書き出した PNG 自体のエッジは硬いままです。ズームなしでも完全にシャープに表示されるよう、16倍か32倍スケールで書き出しましょう。
写真はサーバーにアップロードされる?
いいえ。縮小・パレット適用・ディザリング・書き出しまで、変換はすべてブラウザ内でローカルに実行されます。画像が端末の外に出ることはなく、ツールは無料・登録不要です。
