ドット絵メーカー
ブラウザで1ドットずつ、ドット絵を描けます。無料・登録不要で、描いた絵はお使いの端末に自動で保存されます。
無題のドット絵
32 × 32 ドット · 0色
ペン:クリックかドラッグで描きます。右クリックで消去。Shift+クリックで前の点から直線を引けます。
ドット絵の作り方
4ステップで完成。インストールも会員登録もいりません。
- 1
キャンバスのサイズを決める
アイコンやゲームキャラなら 16×16 か 32×32 がおすすめ。最大 256×256 まで好きなサイズにでき、あとから変えても絵は中央に配置されます。
- 2
色を選ぶ
PICO-8 や Endesga 32 などのレトロなパレット、自分で作ったマイパレット、またはカラーピッカーやカラーコードで好きな色を選べます。
- 3
描いて、塗って、整える
四角形・楕円・塗りつぶしで大まかな形を作り、ペンで細部を1ドットずつ仕上げます。失敗しても Ctrl+Z で元に戻せます。
- 4
保存する
最大64倍のくっきりした PNG で保存できます(グリッド線の有無も選べます)。クリップボードへのコピーや、色番号入りの図案の印刷も可能です。
写真から始めたいときは、画像をドット絵に変換してから「ドットを編集」で仕上げましょう。
必要な機能がそろった、シンプルなドット絵エディター
ドット打ちに必要なツール
ペン、消しゴム、塗りつぶし、スポイト、直線、四角形、楕円。ペンの太さは1〜4ドットで、図形は線だけか塗りつぶしを選べます。
左右対称・上下対称
対称モードをオンにすると、描いたものが反対側にも写ります。顔やキャラクター、アイコンを描くのにぴったりです。
レトロなパレットとマイパレット
ゲームボーイ、PICO-8、コモドール64 などのパレットで描けるほか、自分のパレットを作ったり、Lospec から読み込んだりできます。
100回まで元に戻せる
描く・塗る・サイズ変更・反転など、すべての操作を元に戻したりやり直したりできるので、気軽に試せます。
描いたそばから自動保存
描いた絵はブラウザに自動で保存されるので、タブを閉じても再読み込みしても消えません。サーバーには送信されません。
画像から始められる
ドット絵を開いて1ドットずつ編集したり、写真を変換してから「ドットを編集」で手直ししたりできます。
くっきり保存、図案も作れる
背景透過で最大64倍のくっきりした PNG を保存したり、アイロンビーズ・クロスステッチ・編み物用の図案を印刷したりできます。
スマホ・タブレット対応
指やタッチペンで描けます。2本指でピンチすれば、写真を見るときと同じ感覚で拡大や移動ができます。
ツールとショートカットキー
キーを押すだけで、キャンバスから手を離さずにツールを切り替えられます。
| ツール | キー | 使い方 |
|---|---|---|
| ペン | B | クリックかドラッグで描きます。右クリックで消去。Shift+クリックで前の点から直線を引けます。 |
| 消しゴム | E | クリックかドラッグでドットを透明にします。 |
| 塗りつぶし | G | クリックで同じ色の範囲を塗ります。右クリックで透明に塗りつぶします。 |
| スポイト | I | クリックしたドットの色を描画色にします。どのツールでも Alt を押しながらクリックで使えます。 |
| 直線 | L | ドラッグで直線を引きます。Shift を押すと水平・垂直・45度に固定。 |
| 四角形 | R | ドラッグで四角形を描きます。Shift で正方形。 |
| 楕円 | O | ドラッグで楕円を描きます。Shift で正円。 |
| 表示の移動 | H | ドラッグで表示位置を動かします。スペースキーを押しながら、または2本指でも動かせます。 |
| ショートカット | 動作 |
|---|---|
| Ctrl+Z | 元に戻す(Mac は ⌘Z) |
| Ctrl+Shift+Z / Ctrl+Y | やり直す |
| [ と ] | ペンを細く・太く |
| + と −、またはスクロール | 拡大・縮小 |
| 0 | 絵を画面に合わせる |
| スペース+ドラッグ | キャンバスの表示を移動 |
| Alt+クリック | どのツールでもスポイトで色を取る |
| 右クリック | ペン・塗りつぶし・図形ツールで消す |
| Shift+クリック | ペン:前の点から直線を引く |
初心者向け:ドット絵の描き方のコツ
手描きのドット絵がぐっと上達する、いくつかのポイントです。
- 01
小さなキャンバスから始める
16×16 や 32×32 なら大事なところだけを描くことになり、数分で1枚仕上がります。慣れてきたら大きくしていきましょう。
- 02
まずシルエットを決める
細かいところを描く前に、全体の形を1色で塗ってみましょう。ベタ塗りの状態で何の形かわかれば、完成したときも伝わる絵になります。
- 03
色数をしぼる
よいドット絵の多くは、ほんの数色で描かれています。PICO-8(16色)やゲームボーイ(4色)などのパレットを選ぶと、制限のおかげで絵にまとまりが出ます。
- 04
線をなめらかに
線は、段差の長さが 3-3-3 や 3-2-1 のように規則的に変わるとなめらかに見え、1-3-1-2 のようにばらばらだとガタガタ(ジャギー)に見えます。直線ツールはできるだけ均等な段差で線を引きます。
- 05
光の向きを決めて影をつける
光が来る方向をひとつ決め、その側を明るく、反対側を暗くします。輪郭に向かって全体を暗くする「ピローシェーディング」は避けましょう。
- 06
明るさだけでなく色相もずらす
影は少し青や紫寄りに、ハイライトは黄色寄りにすると、黒や白を混ぜるよりも深みのある色になります。
よくある質問
このドット絵メーカーは無料ですか?
はい、完全に無料です。会員登録も透かしもなく、描ける枚数やダウンロードの回数にも制限はありません。作ったドット絵は個人でも商用でも使えます。
描いた絵は保存されますか?
はい。描いている絵はブラウザのローカルストレージに自動で保存されるので、同じ端末・同じブラウザなら、再読み込みしてもあとで開いても残っています。サーバーには送信されません。ブラウザのデータを消したり、シークレットウィンドウを使ったりすると消えるので、残したい絵は PNG で保存しておきましょう。
写真をドット絵にしてから編集できますか?
はい。ドット絵変換ツールでサイズと色を決め、プレビューの上の「ドットを編集」をクリックすると、ここで開いて手直しできます。「開く」から好きな画像を読み込むこともでき、256×256 ドット以下の画像はそのまま1ドット単位で、それより大きい画像は長い辺が64ドットになるよう縮小して開きます。
背景を透明にするには?
キャンバスは最初から透明(グレーの市松模様)で、消しゴムで消した部分も透明になります。保存した PNG は透明なままなので、ゲームや Web サイト、動画のどんな背景にも重ねられます。
ゲームのキャラ素材は何ドットで描けばいいですか?
キャラクター・アイテム・タイルなら 16×16 と 32×32 が定番で、多くのゲームは素材のサイズをそろえて統一感を出しています。ゲームエンジンに取り込むときは「1倍」で保存し、テクスチャのフィルターを「ニアレストネイバー」(Point、フィルターなし)にすると、ぼやけずに表示されます。
ドット絵をぼやけさせずに大きく保存するには?
「PNGで保存」の横のサイズメニューで、1倍〜64倍を選べます。1ドットがそのピクセル数の正方形になるので、どのサイズでもくっきりしたままです。「グリッド線」をオンにすると、ドットごとに線が入ります。
アイロンビーズやクロスステッチの図案は作れますか?
はい。キャンバスの下の「図案を作る」から、行と列に番号が入り、マスごとの色番号と色ごとのマス数がわかる、印刷用の PDF か PNG をダウンロードできます。
スマホやタブレットでも描けますか?
はい。1本指かタッチペンで描き、2本指でピンチして拡大・移動します。描いている途中に2本目の指が触れたときはその線が取り消されるので、余計なドットが残りません。