コーギー
横 64 px · 自動 16 色
初期設定のままの例です。横 64 ピクセル、写真から選んだ 16 色で、顔、スカーフ、ソファがしっかり判別できます。
無料 · ブラウザで完結
画像・写真をドット絵に変換
写真やイラストなど、あらゆる画像をドット絵に変換できます。マス目のサイズ、自動またはレトロなパレット、ディザリングの有無を選び、気に入らない色はスウォッチから変更。くっきりした PNG、色ごとにレイヤーを分けた PSD、印刷できるビーズ図案としてダウンロードできます。無料で使え、写真が端末の外に出ることはありません。
プレビュー
パレット
無料。写真はこの端末上で変換され、アップロードされることはありません。
作例
写真をドット絵に変換した作例
このツールで変換した 6 枚の写真です。設定はそれぞれ異なります。開くと、写真と設定がそのまま変換ツールに読み込まれます。
コーギーのスプライト
横 48 px · Sweetie 16 · くっきり · 縁取り
透過の切り抜き画像に「くっきり」エッジ、Sweetie 16 パレット、暗い色の 1 ピクセル縁取りを組み合わせて、ゲームにそのまま使えるスプライトに。
いちごのケーキ
横 64 px · Endesga 32
Endesga 32 パレットで、いちごは赤く、クリームは明るいまま。ディザリングは使っていません。
レトロなカメラ
横 48 px · 自動 10 色 · くっきり
10 色、「くっきり」エッジに、コントラストと彩度を少し上げて、アイコンのようにすっきりした商品写真に。
ポートレート
横 80 px · Game Boy · Bayer 4×4 50%
Game Boy の 4 色の緑と組織的ディザで、スタジオで撮ったポートレートが携帯ゲーム機の画面の写真のように。
海辺の町
横 96 px · PICO-8 · Floyd–Steinberg 50%
横 96 ピクセルあれば、海、花、歩く人まで収まります。軽めのディザリングで、空や石壁の PICO-8 カラーがやわらかくなじみます。
使い方
画像をドット絵に変換する方法
ブラウザだけで 3 ステップ。設定を変えるたびにプレビューが更新されます。
01
写真を追加
50 MB までの JPG、PNG、WebP、GIF をドロップ、貼り付け、または選択するか、6 つのサンプルから 1 つを開きます。
02
サイズ・パレット・ディザリングを設定
横のピクセル数、自動またはレトロなパレット、ディザリングの方式を選び、色をクリックして変更・削除します。「比較」で元の写真と見比べられます。
03
ダウンロード
実寸または最大 32× に拡大したくっきりした PNG、色ごとにレイヤーを分けた PSD、.hex・.gpl・.aco 形式のパレット、印刷できるビーズ図案を保存できます。
ビーズ・クロスステッチ図案
写真からアイロンビーズやクロスステッチの図案を作る
「ビーズ図案」でダウンロードできるのは、ドット絵を印刷用にした図案です。1 ピクセルが数えやすい 1 マスになり、行と列には番号付き。凡例には色ごとに必要なビーズやステッチの数が、多い順に並びます。
- 10 ピクセルごとに太線、29 × 29 の四角いプレートの境目にはオレンジの線が入ります。
- 色ごとに文字・数字・記号を割り当て、長辺 185 ピクセルまでの図案では各マスに印字するので、白黒で印刷しても読み取れます。
- 透明部分は空白のまま。背景にビーズを置く必要はありません。
- 色は HEX コードで表示されます。お使いのビーズや糸のメーカーのカラーチャートと照らし合わせてください。
縁取り #1A1C2C · 128 px
#5D275D · 3 px
#333C57 · 5 px
#566C86 · 14 px
#1A1C2C · 27 px
#94B0C2 · 39 px
#B13E53 · 123 px
#EF7D57 · 174 px
#FFCD75 · 193 px
#F4F4F4 · 200 px
元の写真
すべての色を編集
どの色も自由に変えて、Photoshop で編集を続ける
パレットの各色には、その色を使っているピクセル数が表示されます。色か、プレビュー内のピクセルをクリックすると、好きな色に変えたり、パレットの別の色に統合したり、削除してそのピクセルを透明にしたりできます。結果的に同じになった色はまとめられるので、ファイルはすっきりしたままです。
- レイヤー付き PSD では色ごとに 1 レイヤーに分かれ、HEX コードとピクセル数がレイヤー名になります。
- 縁取りは最上部の専用レイヤーに。元の写真を参照用として最下部に非表示で置くこともできます。
- パレットは Lospec 用の .hex、GIMP・Aseprite・Krita 用の .gpl、Photoshop のスウォッチ用の .aco でダウンロードできます。
パレット
レトロから現代まで、ドット絵のパレット
まずは「自動」から。往年のゲーム機の色に固定することもできます。Lospec などで入手した .hex や .gpl のパレットも読み込めます。
自動（写真から抽出）
2〜64 色写真をいちばんよく表す色を、人の目の感じ方に近い OKLab 色空間で選びます。2〜64 色の範囲で設定できます。
Game Boy
4 色初代携帯ゲーム機の画面の 4 色の緑。明るさで合わせるので、どんな写真でも 4 階調すべてが使われます。
PICO-8
16 色ファンタジーコンソール PICO-8 の固定パレット。明るく鮮やかで、ひと目でレトロな雰囲気に。
NES
55 色NES（海外版ファミコン）の、色数は多いものの偏りのあるパレットを、一般的なバージョンで再現。
Commodore 64
16 色Commodore 64 の落ち着いたアースカラー。広く使われている Pepto 版です。
CGA
4 色黒、シアン、マゼンタ、白。初期の PC ゲームでおなじみの、いちばん派手な 4 色です。
ZX Spectrum
15 色ZX Spectrum の純色を、通常と高輝度の 2 段階で。
Endesga 32
32 色ゲーム制作で人気の現代的なパレット。温かみのある肌色、緑、深い影色がそろっています。
Sweetie 16
16 色キャラクター、スプライト、パステル調の風景に合う、やわらかな現代的パレット。
グレースケール
8 色明るさで合わせた均等な 8 段階のグレー。印刷物や新聞のような風合いに。
白黒
2 色2 色だけの 1 ビットアート。Atkinson や組織的ディザと組み合わせてみてください。
NES、Game Boy、Commodore 64 には、公式に定められた唯一の RGB 値のセットがありません。ここでは多くのドット絵作家が使っているバージョンを採用しています。
ガイド
変換の仕組みと、きれいなドット絵を作るコツ
写真がどのように処理されるのか、そしてサイズ・色・ディザリングの選び方を解説します。
写真がドット絵になるまで
まず写真をマス目に縮小します。「なめらか」は各マスの平均色、「くっきり」はいちばん多い色を使います。次に自動レベル補正、明るさ、コントラスト、彩度を適用。続いて OKLab で照合しながら色をパレットに減色し、必要に応じてディザリングをかけます。最後に各マスをニアレストネイバー法で拡大するので、くっきりした正方形のまま保たれます。
ちょうどいい横幅を選ぶ
見た目をいちばん左右するのは横幅です。横 32 ピクセルなら大胆でアイコン風、48〜64 なら顔やペットが判別でき、96〜128 なら風景全体が収まります。スプライトやアイコンは 16、32、64 ピクセル四方がよく使われます。先に被写体の近くでトリミングしておきましょう。背景に使ったピクセルの分だけ、ディテールが失われます。
色数を絞るほどドット絵らしく
昔のハードウェアには厳しい制限がありました。Game Boy は 4 階調、PICO-8 と Commodore 64 は 16 色です。写真なら自動で 8〜16 色にすると手描き風に見え、肌や空には 24〜32 色を使いましょう。ビーズ作品なら、色数が少ないほど買うビーズの色も少なくて済みます。
ディザリングの使いどころと種類
ディザリングは、パレットの 2 色を模様状に混ぜて中間の色合いを表現する手法です。平坦ですっきりしたスプライトにはオフがおすすめ。組織的ディザ（Bayer）は往年のゲームのような規則的な網目模様、Floyd–Steinberg はいちばんなめらかなグラデーション、Atkinson はコントラスト強めの仕上がりになります。ざらついて見えるときは強さを下げてください。
JPEG ではなく PNG で保存
PNG は可逆圧縮なので、各ブロックが正確に 1 色のまま保たれます。JPEG は圧縮によってブロックの境目ににじみや余計な色が出ます。ゲームエンジン用には 1× でダウンロードし、共有や印刷用には整数倍で拡大すれば、すべてのピクセルが正方形のまま保たれます。
透過 PNG からきれいなスプライトを
背景を透明にした切り抜き画像から始めましょう。透明部分は透明のまま、半透明の縁のピクセルは完全な不透明か透明のどちらかになり、オプションの 1 ピクセル縁取りが形をなぞります。先に切り抜きが必要なら、写真からステッカー作成で作れます。
活用例
写真から作ったドット絵の使い道
ゲームのスプライト
参考写真や切り抜き画像を、透明部分の境目がくっきりした、1 ピクセル縁取り付きのスプライトに。パレットはドット絵エディタにも読み込めます。
アイコン・プロフィール画像
自分やペットのレトロなポートレートを、Discord、Twitch、ゲームのプロフィールに。8× 以上でダウンロードすれば、大きくてもくっきりした画像になります。
アイロンビーズ作品（Perler・Hama）
アイロンビーズ作品の設計に。横 29 ピクセルで四角いプレート 1 枚にぴったり収まり、図案には色ごとのビーズの数も載ります。
クロスステッチ・編み込みの図案
番号付きのマス目と記号の凡例は、そのまま図案として使えます。1 ピクセルが 1 目です。
うまく変換できるもの・できないこと
すべてのピクセルはあなたの写真から生まれます。描き直したり、何かを付け足したりはしません。
向いているもの
- ペット、ポートレート、料理、商品など、被写体がひとつに絞られた写真。
- ロゴ、イラスト、スクリーンショット（エッジを「くっきり」に設定）。
- 透過 PNG の切り抜き画像。縁取り付きのスプライトに。
- 暗い写真やメリハリのない写真。自動レベル補正が先に階調を広げます。
制限事項
- AI のように描き直すことはしません。マス目がごく少ないと、目や小さな文字はつぶれてしまいます。
- 静止画のみ対応。アニメーション GIF は最初のフレームが使われます。
- マス目は横 256 ピクセル（縦 512）まで、ダウンロードは長辺 4,096 ピクセルまでです。
- 1 ピクセルずつ描く機能はありません。PNG はドット絵エディタで、PSD は Photoshop で編集してください。
- ビーズや糸のメーカーの色とは自動で照合しません。図案には HEX の色コードが記載されます。
ドット絵変換のよくある質問
写真や画像をドット絵に変換するにはどうすればいいですか？
上の変換ツールに写真を追加し、横のピクセル数、パレット、ディザリングの方式を選んでダウンロードするだけです。初期設定の横 64 ピクセル・写真から選んだ 16 色で、たいていの写真はうまく変換できます。
このドット絵変換ツールは無料ですか？
はい。すべてブラウザ内で動作し、登録不要、クレジット不要で、透かしも入りません。
写真はアップロードされますか？
いいえ。画像はお使いの端末上で、ブラウザのバックグラウンドワーカーによって読み込み・変換されます。サーバーに送信されることはありません。
ドット絵のサイズはどのくらいがいいですか？
被写体しだいです。横 32 ピクセルなら大胆なアイコン風、48〜64 なら顔やペットが判別でき、96〜128 なら風景が収まります。昔ながらのスプライトは 16、32、64 ピクセル四方がよく使われます。ビーズ作品なら、29 ピクセルで四角いプレート 1 枚分です。
ドット絵の色数はいくつがいいですか？
色数が少ないほどドット絵らしくなります。Game Boy のパレットは 4 階調、PICO-8 は 16 色です。写真なら自動で 8〜16 色がおすすめで、肌の色や空には 24〜32 色を使いましょう。
写真からアイロンビーズの図案は作れますか？
はい。プレートに合わせて横幅を設定し（29 ピクセルで四角いプレート 1 枚分）、色数を少なめにしてから「ビーズ図案」をダウンロードしてください。行と列の番号、色ごとの記号、色ごとのビーズの個数が入った印刷用の図案になります。HEX の色とお使いのビーズメーカーの色の照合は、ご自身で行ってください。
ドット絵を Photoshop で編集できますか？
はい。レイヤー付き PSD ではパレットの色ごとに 1 レイヤーに分かれ、HEX コードとピクセル数がレイヤー名になります。縁取りは最上部に置かれ、必要なら元の写真を最下部の非表示レイヤーとして追加できます。.aco パレットは Photoshop のスウォッチパネルに読み込めます。
ドット絵の保存は PNG と JPEG のどちらがいいですか？
PNG です。可逆圧縮なので、各ブロックが正確に 1 色のまま保たれます。JPEG は圧縮でブロックの境目がにじみ、パレットにない色が混ざります。
AI で写真からドット絵を作れますか？
AI の画像生成はドット絵風の見た目をまねることはできますが、ピクセルが本当のマス目にそろうことはまれで、色もずれがちです。この変換ツールはあなたの写真そのものから、正確なマス目と固定パレットを持つ本物のドット絵を、編集できるファイルとして作ります。
画像→ドット絵変換
さっそくドット絵を作ってみましょう
写真をドロップしてサイズとパレットを選べば、PNG、PSD、ビーズ図案でダウンロードできます。無料で、アップロードもありません。
写真を変換する