👾
pixel-art-editor,
ドット絵エディター
ブラウザ上でドット絵を作成できる無料エディター。
🎨
グリッド描画
🖌️
パレット&カラーピッカー
🔒
サーバー送信なし
🔒
すべてブラウザ内で処理されます。
about,
概要
ブラウザ上でドット絵(ピクセルアート)を作成・保存できるエディター。8×8〜64×64のグリッドに1ピクセルずつ描画。
鉛筆・塗りつぶし・消しゴム・矩形ツール搭載。PNG保存時は1x/2x/4x/8xの拡大率に対応しています。
how to,
使い方
STEP 1
キャンバスサイズ選択
8×8〜64×64のグリッドサイズを選択
STEP 2
ドット絵を描く
パレットから色を選び、鉛筆ツールでピクセルを配置
STEP 3
PNG保存
好きな拡大率でPNG保存。ゲームやSNSアイコンに活用
glossary,
用語集
- ピクセルアート
- コンピュータ画面を構成する最小単位である「ピクセル(ドット)」を1つずつ手作業で配置し、キャラクターや風景を描き出すデジタルアートの手法です。レトロゲーム特有のノスタルジックな魅力があり、現在でもインディーゲームやSNSアイコンなどで絶大な人気を誇っています。
- グリッド
- キャンバス上に表示される、ピクセルの境界線を明確にするための格子状のガイドラインです。ドット絵制作においては、どの位置にピクセルを打つかを正確に把握するために必須の機能であり、編集中は常に表示させておくことで作業効率が大幅に向上します。
- パレット
- キャンバスに描画する際に使用できる「色の一覧(絵の具のセット)」を指します。あらかじめ用意されたレトロゲーム風の標準32色セットのほか、カラーピッカーを使ってプロジェクトに合わせたカスタムカラーを選択・使用することで、統一感のある作品に仕上がります。
- 塗りつぶし(Flood Fill)
- キャンバス上で同じ色が連続している領域(閉鎖された空間)を、ワンクリックで別の色に一括で変更する便利なツールです。キャラクターの服の色を後から変えたり、背景全体を一瞬で別の色で塗り直したりする際に活用でき、大幅な時短に繋がります。
- アンチエイリアス
- デジタル画像において、斜め線や曲線の境界部分に中間色を補間し、ギザギザ(ジャギー)を滑らかに見せる画像処理技術です。ドット絵(ピクセルアート)特有のシャープな質感を損なうため、保存時や拡大時にはこの処理を意図的に無効化(Nearest Neighbor法)するのが基本です。
- スプライト
- 主に2Dゲーム開発において、背景とは独立して画面上を動くキャラクターやアイテムなどの小さな画像のことを指します。本ツールを使えば、背景を透過したPNGスプライトを簡単に作成でき、UnityやRPGツクールなどのゲームエンジンにそのままインポートして利用可能です。
- 透過(Alpha)
- 画像の一部を透明にして、背後にある背景色や別の画像を透けて見せるための設定です。キャラクター画像を作成する際、周りの余白部分を透過状態にしておくことで、Webサイトやゲーム画面に配置したときに背景と自然にブレンドされるようになります。
- 拡大率(Scale)
- 完成したドット絵を画像として保存する際に、元のピクセルサイズを何倍に拡大するかを決定する数値です。たとえば原寸が32×32ピクセルの場合、そのままSNSに投稿すると小さすぎてぼやけてしまうため、4x(128px)や8x(256px)に拡大して保存することでくっきりと表示させます。
faq,
FAQ
- Q.キャンバスサイズは?
- 本エディターでは、8×8、16×16、32×32、48×48、64×64の5種類の正方形キャンバスから選択できます。ファミコン風のレトロなドット絵なら16×16、緻密なキャラクターやアイコン制作なら32×32以上がおすすめです。用途に応じて最適なサイズをお選びください。
- Q.画像がサーバーに送信されますか?
- 画像データや描画内容が外部のサーバーに送信されることは一切ありません。本ツールはHTML5のCanvas APIを活用し、描画からPNG生成まですべての処理をブラウザ(ローカル環境)で完結させています。機密性の高い素材も安全に制作できます。
- Q.透明ピクセルは使えますか?
- はい、ご利用いただけます。パレットから「透明(Transparent)」を選択してキャンバスを塗ることで、消しゴムのように対象ピクセルを透過状態に戻せます。ゲーム用のスプライト素材や背景透過のSNSアイコン作成に非常に便利です。
- Q.Undo/Redoはできますか?
- はい、最大50手までの操作履歴を記憶しており、Undo(元に戻す)およびRedo(やり直し)が可能です。間違えて別の色で塗りつぶしてしまった場合や、細かなドットの打ち間違いもすぐにワンクリックで修正できるため、ストレスなく制作を進められます。
- Q.保存画像のサイズは?
- ダウンロード時のPNG画像は、1x(原寸)、2x、4x、8xの4段階の拡大率から選択可能です。16×16のキャンバスを8xで保存した場合、128×128ピクセルの画像として出力されます。SNSや各種ツールで鮮明に表示させたい場合は、大きめの拡大率(4x〜8x)での保存を推奨します。
- Q.スマートフォンでも使えますか?
- はい、スマートフォンのタッチ操作にも完全対応しています。画面をタップしてドットを打ったり、ドラッグで直線を引いたりすることが可能です。外出先のスキマ時間でも、思いついたアイデアをブラウザ上ですぐにピクセルアートとして形にすることができます。
- Q.色は自由に選べますか?
- 基本的な32色の厳選されたレトロカラーパレットに加えて、標準のカラーピッカー機能を搭載しています。HEXコードやRGB値で指定した任意の色を自由に追加して使用できるため、あなたのイメージ通りの緻密なグラデーションや配色を表現することが可能です。
- Q.作業中のデータは保持されますか?
- 現在の仕様では、ブラウザのタブを閉じたりページをリロードしたりすると、描画中のデータはリセットされて消えてしまいます。長時間の作業を行う場合は、進行状況を失わないようにこまめに「PNG保存」ボタンからローカルに画像をダウンロードしてバックアップを取るようお願いいたします。
use cases,
活用シーン
🎮
ゲーム素材の作成
インディーゲームのキャラクター・アイテムスプライトを制作
👤
SNSアイコン作成
ドット絵風のオリジナルプロフィールアイコンを作成
🎨
デジタルアート入門
ドット絵制作を通じてデジタルアートの基礎を学ぶ
💬
絵文字・スタンプ作成
チャットやメッセージ用のオリジナルスタンプを制作
フィードバックを送信
ツールをより良くするためのご意見をお聞かせください。
フィードバックを送信しました。ご協力ありがとうございます!
エラーが発生しました。しばらく経ってから再度お試しください。
現在、フィードバックの受付を一時停止しています
サーバーが混み合っているか、スパム防止のための安全装置が作動しています。しばらく経ってから再度アクセスしてください。