ブラウザでドット絵を作成。6種の描画ツール、左右対称モード、4種のパレット、8×8〜64×64キャンバス。最大16コマ・4レイヤー、GIF・コマ一覧PNG出力、下書き自動保存、JSON保存・読込に対応。
自動保存を確認しています…
下書きはこの端末・ブラウザ内に1件保存します。別端末との同期・バックアップではありません。大切な作品はJSONでも保存してください。
矢印キーでセルを移動し、EnterまたはSpaceで選択中のツールを実行します。直線と四角形は始点と終点で2回実行します。Escape、ツール切替、キャンバスからのフォーカス移動で始点を取り消します。
コマ 1/16 · レイヤー 1/4 · 戻せる操作 0/50
指の操作だけを切り替えます。スクロールではページを移動し、描画では線を描きます。マウス・ペンはどちらでも描けます。
このツールは、ブラウザだけで本格的なピクセルアート（ドット絵）を作成できる無料のオンラインエディタです。インストール不要で、PC・タブレット・スマートフォンから利用できます。
ピクセルアートは、1ピクセル単位で色を配置して絵を描く表現技法です。1970〜90 年代の 8bit / 16bit 世代の家庭用・携帯型ゲーム機のグラフィックで広く使われ、ハードウェアの色数・解像度制限の中で最大限の表現を追求する職人的な技術として発展しました。近年ではインディーゲームやNFTアート、SNSアイコンの制作手段として再び注目を集めています。
画像データとプロジェクトファイルはブラウザ内で処理され、NanTooの処理サーバーには送信されません。サイト共通の広告配信・アクセス解析については、プライバシーポリシーをご確認ください。
| ツール | 機能 | 用途 |
|---|---|---|
| ✏️ ペン | クリック/ドラッグで1ピクセルずつ描画 | 基本の描画操作 |
| 🧹 消しゴム | ピクセルを透明に戻す | 描き間違いの修正 |
| 🪣 バケツ | 同色の連続領域を一括塗りつぶし（BFS） | 広い領域の塗り |
| 💧 スポイト | キャンバス上の色を取得 | 既存の色を再利用 |
| 📏 直線 | 始点→終点をドラッグして直線を描画 | 輪郭線・斜め線 |
| ⬜ 四角形 | ドラッグで矩形を描画（塗りつぶし切替可） | 建物・UI要素 |
直線ツールは Bresenham のアルゴリズムを採用しており、整数座標上で途切れにくい直線のピクセル列を生成します。これは 1965 年に Jack Bresenham が提案した古典的手法で、現代のピクセルアートエディタでも標準的に使われています。
バケツツールは幅優先探索（BFS）による Flood Fill を実装しています。クリックした位置と同じ色のピクセルを上下左右に探索し、連続する領域を一括で塗りつぶします。
4段階のキャンバスサイズから目的に応じて選択できます:
| サイズ | ピクセル数 | おすすめ用途 |
|---|---|---|
| 8×8 | 64 px | ファビコン、ミニアイコン、絵文字 |
| 16×16 | 256 px | ゲームキャラクター、SNSアイコン |
| 32×32 | 1,024 px | 詳細なキャラ、アイテム、タイルマップ |
| 64×64 | 4,096 px | ポートレート、風景、高精細ドット絵 |
初心者には 16×16 がおすすめです。制約が適度にあるため「どこに何色を置くか」を考えやすく、ピクセルアートの基礎を学ぶのに最適なサイズです。
1980 年代のレトロゲーム機を意識した配色を含む 4 種類のプリセットを搭載しています:
プリセット以外の色も、カラーピッカーまたはHEXコード直接入力で自由に使用できます。制限されたパレットで描くことは、統一感のあるドット絵を作るための重要なテクニックです。
左右対称（ミラー）モードを有効にすると、キャンバスの中央に赤い点線ガイドが表示され、描画位置と左右対称の位置へ同時に反映されます。ペン、消しゴム、バケツ、直線、四角形で利用できます。
このモードは以下のような制作で特に効果的です:
左右を個別に描く手間を減らせます。非対称な部分（髪型や武器など）は、ミラーモードをオフにしてから描き足してください。
完成した作品は PNG 形式でダウンロードできます。出力時に以下の設定が可能です:
PNG出力では各セルを整数倍の四角形として描くため、拡大時に補間によるぼかしを加えません。JPEG は非可逆圧縮でドット絵のエッジにノイズが発生するため、ピクセルアートの保存には不向きです。
制作途中の作品は JSON ファイルとして保存・読込ができます。新形式（version 2）は全コマ、レイヤー、表示・ロック・不透明度、コマの表示時間を保存します。最大16コマ・4レイヤー、ファイルは4MiB以下です。保存したJSONを次回読み込むことで続きを編集できます。
編集した作品は、この端末・ブラウザ内に下書きとして1件自動保存します。再訪時は「下書きを復元」を選んでください。保存待ち・保存失敗時の変更や、ブラウザのデータ削除で失われる場合があるため、重要な作品はJSONでも保存してください。別の端末との同期ではなく、Undo/Redo履歴も下書きには含みません。別タブで下書きが更新された場合は上書きせず、自動保存を停止して知らせます。
読込時は確認のうえ現在の作品を置き換えます。「戻す」で直前の作品にも戻れますが、履歴はUndo/Redo合計50操作・32MiBの上限があります。読み込めるキャンバスは8・16・32・64の正方形です。
従来のversion 1（128KiB以下）も読めます。単一コマ・単一レイヤーなど互換条件を満たす作品は「旧形式で保存」も利用できます。旧形式の構造は以下です:
version: 旧フォーマットバージョン (1)size: キャンバスサイズ (8/16/32/64)grid: 2次元配列。各要素は HEX カラーコード (空文字は透明)PNGは現在選択しているコマの表示レイヤーを合成して出力します。「コマ一覧PNG」は全コマを左から右・上から下の順に並べたスプライトシートです。列数を指定でき、余った領域にも出力の背景設定を使います。各辺4096px・合計4,194,304画素が上限です。
2コマ以上ならGIFアニメーションも保存できます。最大16コマ・各辺256px、無限ループです。各コマの表示時間はGIFに合わせて10ms単位へ丸めます。GIFは最大256色・透明か不透明かの2値であり、半透明や色がPNGと異なる場合があります。GIFの透過は不透明度50%未満を透明にします。処理は端末内で行い、中止ボタンで取り消せます。
ピクセルアート初心者へのアドバイス:
ピクセルアートの歴史はコンピュータグラフィックスの黎明期にまで遡ります。1970年代のアーケードゲーム（スペースインベーダー、1978年）や、1980年代の家庭用ゲーム機の普及とともに、限られたハードウェア資源の中で視覚表現を追求する技法として確立されました。
1980 年代の代表的な 8bit 家庭用ゲーム機は同時表示 25 色・スプライト解像度 8×8 / 8×16 px、同時期の携帯型ゲーム機は 4 階調モノクロという厳しい制約がありましたが、その中で生まれた表現技法は現代でも芸術的価値を認められています。
2010年代以降、Undertale、Celeste、Stardew Valley などのインディーゲームがピクセルアートを採用して世界的ヒットとなり、懐かしさと新しさを兼ね備えた表現様式として再評価されています。ゲーム以外にも、SNSのプロフィール画像やWeb用アイコンなどへ用途が広がっています。
本ツールは以下の Web 標準技術で構築されています:
描画、PNG生成、プロジェクト読込はクライアントサイドで完結し、画像・プロジェクトデータをNanTooの処理サーバーへ送信しません。
絵文字 (Emoji) の歴史 ― 1999 年 NTT ドコモ 176 文字から MoMA、Unicode 16 まで
絵文字は1999年に栗田穣崇がNTTドコモのi-modeで設計した176文字に起源を持つ。日本ローカルから始まった文化が、2010年Unicode 6.0で世界標準に、2016年にはMoMA永久コレクション入り。本記事ではUnicode Consortium、MoMA、栗田氏インタビュー等の一次ソースから絵文字史を整理します。
ピクセルアートの歴史と技法 ― デジタル画像、ゲーム機の制約、現代のドット絵制作
1957年のデジタル画像実験と手描きのドット絵を区別し、ファミコンやゲームボーイの表示制約、クラスタ・色のランプ・ディザリング、Asepriteの現行ライセンスまで解説します。
画像フォーマット変換
8形式の画像をJPEG・PNG・WebP・AVIF・TIFF・GIFへ変換。最大20件・入力合計200MBの順次変換、品質調整、個別・ZIPダウンロードに対応。アニメーションと複数ページは先頭のみ。
画像圧縮ツール
JPEG・PNG・WebP・AVIFの静止画をブラウザまたはサーバーで圧縮。端末内処理とSharp処理を比較でき、品質調整・縮小・メタデータ除去に対応。
favicon ジェネレーター
JPEG・PNG・WebP・SVGから16〜512pxのPNG、ICO、Apple Touch Iconを生成。中央切り抜き、ZIP、HTMLタグとmanifestのicons設定例に対応。
カラーコード変換ツール
HEX・RGB・HSL・HSV・CMYKを相互変換。編集値を保持した連続入力、WCAG 2.2コントラスト比、黒白推奨色、配色パレットに対応。
画像から GIF アニメ作成ツール
JPEG・PNG・WebPを1回40候補まで確認し、最大20枚並べてGIFアニメを作成。表示時間、2値透過、繰り返し、品質、収める・切り抜く・引き伸ばす配置を調整でき、処理はブラウザ内で完結。