ドット絵変換
写真やイラストを、レトロゲームのようなドット絵（ピクセルアート）に変換します。ドットの細かさとゲームボーイ風・ファミコン風などの色合いを選ぶだけ。画像は端末の中だけで処理され、外部に送信・保存されることは一切ありません。
最終更新: 2026-06-17 ／ 制作: 手軽屋 ／ 参照: MDN Web Docs（Canvas API ピクセル操作・image-rendering CSS・imageSmoothingEnabled）
ドットの細かさ
色合い
このツールの特徴
6種類の固定配色
ゲームボーイ風4階調・ファミコン風16色・白黒・セピア・レトロ8色・フルカラー。クリックひとつで切替。
ドット16〜128段階
スライダーで粗さを自由調整。16なら超レトロ、128なら細密な近代ピクセルアート風。
端末内完結・ゼロ送信
Canvas APIで全処理。元画像も完成画像もネット送信されません。家族の写真でも安心。
PNG出力で劣化なし
可逆圧縮のPNGで保存。SNSアイコン・配信素材・印刷下絵いずれにも使えます。
使い方（5ステップ）
- 「画像を選択」ボタンで写真ファイルを読み込む（ドラッグ&ドロップ対応）
- ドット粗さスライダーを動かす（推奨初期値: 64）
- 配色プリセットを6種類から選択（迷ったらまずファミコン風）
- プレビュー画像を見ながら好みの仕上がりに調整
- 「ダウンロード」でPNG画像を端末に保存
技術的な詳細
1. 縮小フェーズ
Canvas の drawImage() で元画像を指定ドット数(例:64×64)まで縮小。これでバイリニア補間により色が自動で均され、モザイク状になります。
2. 量子化フェーズ
getImageData() で全ピクセルのRGBA値を Uint8ClampedArray として取得。1ピクセル=4バイト(R,G,B,A)。配色プリセットの色配列と各ピクセルの距離(ユークリッド距離)を計算し、最も近い色に置換します。
3. 拡大フェーズ
置換後の小さなImageDataを putImageData() で書き戻し、最終的にCSSの image-rendering: pixelated で整数倍拡大。imageSmoothingEnabled=false も併用して輪郭のシャープさを保ちます。
こんなときに便利
- ・SNSのアイコンやヘッダーを、レトロゲーム風のドット絵にしたいとき
- ・ペットや推しの写真をピクセルアート風に加工して投稿したいとき
- ・自作ゲームやドット絵創作の下絵・色の参考にしたいとき
- ・顔写真をそのまま載せたくないので、ドット絵にぼかして使いたいとき
- ・レトロな雰囲気のサムネイルや配信素材を手早く作りたいとき
- ・LINE Stamp/Discord絵文字用に16〜32ドットの素材を作りたいとき
日本のユーザー向けポイント
日本ではファミコン(1983年)・ゲームボーイ(1989年)を体験した世代から、令和の「インディーゲームのドット絵リバイバル」(UNDERTALE風など)世代まで、ピクセルアートに対する文化的親しみが幅広く存在します。
本ツールのファミコン風プリセットは、当時の任天堂ハードのカラーパレット(54色から同時16色表示)を意識した配色です。ゲームボーイ風は初代Game Boyの4階調モノクロLCD(緑がかったオリーブ系)を再現しています。SNSアイコンに使うなら、Twitter/X(400×400px推奨)、Instagram(320×320px)、LINEプロフィール(640×640px)など各SNSの推奨サイズに合わせて画像リサイズすると最適です。
ご利用上の注意
- 本ツールは元画像の著作権を確認しません。フリー素材または自分が撮影/作成した画像のみご利用ください。
- 他人の顔写真をドット絵化してSNSに公開する場合は、必ず本人の同意を得てください。
- 長辺3000px以上の高解像度画像はブラウザによっては処理に数秒〜十数秒かかります。
- 「ゲームボーイ」「ファミコン」は任天堂株式会社の商標です。本ツールは互換品ではなく、配色を参考にした独立ツールです。
よくある質問
Q. どんな仕組みでドット絵になるのですか？
A. 画像をいったん指定したドット数まで縮小し（これで色が均されてモザイク状になります）、選んだ配色の中からいちばん近い色に置き換えたうえで、輪郭がくっきり残るように拡大しています。レトロゲームの画面と同じ「少ない色数×粗いマス目」を再現する方式です。
Q. 「ゲームボーイ風」「ファミコン風」とは何ですか？
A. 昔のゲーム機の画面を思わせる配色です。ゲームボーイ風は緑がかった4階調、ファミコン風は当時のテレビゲームらしい16色に置き換えます。ほかに白黒2色・セピア・レトロ8色・元の色を残すフルカラーが選べます。
Q. きれいに変換するコツはありますか？
A. 被写体が大きくはっきり写っている写真ほどドット絵映えします。背景がごちゃごちゃしている場合はドットを粗め（32〜48）に、細部を残したい場合は細かめ（96〜128）にすると印象が変わります。アイコン用途なら、先に正方形に切り抜いてから変換するのがおすすめです。
Q. 画像がサーバーにアップロードされることはありませんか？
A. ありません。縮小も色の置き換えもすべてお使いの端末のブラウザの中だけで行われ、元の画像も完成したドット絵もサーバーには一切送信されません。お子さんやご家族の写真でも安心してお使いください。
Q. 拡大表示してもボケないのはなぜですか？
A. Canvas の imageSmoothingEnabled を false に設定し、CSS の image-rendering: pixelated を適用しているためです。これにより最近傍法(Nearest Neighbor)でリサイズされ、ピクセルの鮮明さが維持されます。
Q. スマホでも使えますか？
A. iOS Safari と Android Chrome の両方で動作確認済みです。Canvas API は2010年代から標準実装されており、追加アプリのインストールは不要です。長辺2000ピクセル以下の画像を推奨します。
Q. 商用利用や印刷物に使えますか？
A. 本ツールの出力自体に追加ライセンスはありません。ただし元画像の著作権・肖像権の確認はご利用者の責任となります。フリー素材や自分で撮影した画像であれば問題なくご利用いただけます。