BlockPixelArt
English

ブラウザで動く無料のドット絵メーカー

読み込んだ画像の色数とドットサイズを決めたら、あとはペン・塗りつぶし・スポイトで1マスずつ仕上げていくだけです。作業中のデータが端末の外に出ることはありません。

画像をここにドロップ

またはファイルを選択してください。画像はブラウザ内で処理され、アップロードされることはありません。

使い方

  1. 下敷きになる画像を用意する

    白紙から描き始める機能はまだなく、必ず1枚の画像が出発点になります。写真でも、自分で描いたラフでも、輪郭だけの線画でも構いません。人物なら顔が大きく写っているものほど、少ないマス数でも誰か分かる仕上がりになります。

  2. マスの粗さを決める

    スライダーを動かすと、縦横に並ぶマスの数がその場で変わります。細かいほど元の絵に近く、粗いほど手で直す手間が減ります。あとで一つずつ描き直すつもりなら、思っているより粗めに寄せたほうが作業が進みます。

  3. パレットで色数を絞る

    ファミコン・ゲームボーイ・PICO-8・C64・白黒2色から選ぶか、読み込んだ絵から色を抜き出して専用のパレットを組めます。色数を決めてしまうと、このあと描き足す色も自動でその中に収まります。

  4. ペンと塗りつぶしで描き直す

    キャンバスの下に並ぶ道具から選びます。ペン（B）、消しゴム（E）、塗りつぶし（G）、同じ色をまとめて置換（R）、スポイト（I）。ペンの太さと塗りつぶしの許容値はそれぞれ数値で変えられます。

  5. PNGで書き出す

    「小」は1マス=1ピクセルのそのままの大きさで、ゲームエンジンやアイコン設定にそのまま渡せます。「大」は整数倍に引き伸ばした版で、SNSや配信画面のように大きく表示する用途向けです。

活用例

  • プロフィールのアイコン

    顔写真を出発点にして、目や口だけ手で描き直すと、本人だと分かるのに写真そのものではないアイコンになります。表示が小さいほど、色数を絞ったほうが輪郭が残ります。

  • 配信やチャットのスタンプ

    表情を数パターン作って並べると、統一感のあるスタンプ一式になります。透過つきで書き出せるので、背景の色が違う場所に置いても浮きません。

  • キャラクターのドット素材

    写真やイラストから当たりを取り、細部だけ手で詰める流れです。1マス=1ピクセルで出せるため、UnityやGodotにスプライトとしてそのまま渡せます。

  • ロゴやマークのドット化

    既存のロゴを粗いマスに落として、はみ出した部分を置換ツールで整えます。角と斜めの線を手で直すだけで、印象がかなり変わります。

  • サムネイルのワンポイント

    記事や動画のサムネに1点だけドットの要素を混ぜると、写真だけの並びの中で目に留まります。大きい倍率で書き出してもマスの角が保たれます。

このツールの特徴

  • 変換した直後から手を入れられる

    できあがりを別のソフトに持っていく必要がありません。気になったマスをその場で押して直せます。変換して見る、直す、また見る、の往復が同じ画面で完結します。

  • 描き足した色がパレットから外れない

    パレットを選んでいる間は、手で置く色もその中の色に吸い寄せられます。手直しを重ねるほど色数が増えていく、という一番よくある崩れ方が起きません。

  • 取り消しとやり直しが効く

    Ctrl/Cmd+Z で戻り、Shift を足すと進みます。手で直した部分は元の絵とは別の層に載っているので、あとからマスの粗さやパレットを変えても消えません。

  • マス目を表示しながら描ける

    格子線を出すと、どのマスを押しているのかが目で分かります。線は表示だけのもので、書き出したファイルには一切入りません。

  • 太さと許容値を数値で決められる

    ペンの太さはマス単位、塗りつぶしは「どこまで同じ色とみなすか」を数値で指定します。パレットを効かせている絵なら0、写真のままの絵なら少し上げる、という使い分けになります。

よくある質問

白紙のキャンバスに一から描けますか？
いまのところできません。必ず画像を1枚読み込むところから始まります。どうしても一から描きたい場合は、単色で塗りつぶした画像を読み込ませ、その上に描いていく形になります。白紙から始める機能は検討していますが、まだ入っていません。
手で直したあとに設定を変えると消えますか？
パレットや明るさを変えても、手で置いたマスは残ります。手直しは変換結果の上に重なる別の層として持っているためです。ただしマスの粗さだけは例外で、直したマスがどこを指すか分からなくなるので、手直しが1つでもある間は変更できないようにしてあります。
パレットにない色を置きたいときは？
パレットを「元の画像のまま」に戻せば、色の制限がなくなり好きな色を置けます。逆に、一部だけ制限の外の色を混ぜる、という使い方には対応していません。色数を守ることのほうが仕上がりに効くと考えているためです。
ペンの色はどこで選びますか？
道具の並びの横に現在の色が出ていて、パレットを選んでいればその色見本から選べます。絵の中にある色を使いたいときはスポイト（I）でその場所を押すと、その色がペンに入ります。
文字をドット絵にできますか？
文字を打ち込んでドット絵のフォントで並べる機能はまだありません。文字を画像として書き出してから読み込めば、ドット化して手で整えることはできます。文字専用の機能は開発予定に入っています。
作った画像は自由に使えますか？
書き出した画像の権利はすべてあなたのものです。透かしも入らず、商用利用の制限もクレジット表記の義務もありません。ただし元にした画像に他人の権利がある場合は、そちらの条件がそのまま残る点にご注意ください。

他のドット絵ツール

同じエンジン、同じプライバシー、違う用途。すべてアカウント不要です。