ドット絵パレットの選び方｜16色で美しく見せる配色の基本ルール

ドット絵の配色は、ファミコンの8×8ドット単位の4色制約から、スーパーファミコンの32,768色中16色×8パレットへと広がってきた制約の歴史である。
PICO-8を設計したZep（Joseph White）が示した128×128ピクセル・固定16色という発想も、限られた色数の中で見栄えを組み立てるための明快な基準になっています。
DawnBringer 16（DB16）は、Pixel JointユーザーのDawnBringerが設計した16色パレットで、色空間的に離れた色をそろえた設計が特徴です。
#140c1cや#442434、#30346d、#4e4a4eのような色を起点にすると、無彩色に寄りすぎず、暗部のヒューシフトも含めて画面全体の調和を作りやすくなります。
色数を増やすより、既製パレットを土台にして調整するほうが、初心者でも配色の破綻を抑えやすいでしょう。
Asepriteに取り込んで扱う流れも定番で、まずはDB16のような実績ある16色から始めてみてください。

この記事を要約すると

• ファミコン：8×8ドット単位で4色（透明含む）、キャラクター表現色は実質3色
• スーパーファミコン：32,768色の中から16色×8パレットを使用、1パレットあたり実質15色（背景色1色含む）
• PICO-8：128×128ピクセル、固定16色パレット。隠しパレット含めると計32色。設計者はZep（Joseph White）
• DawnBringer 16（DB16）：Pixel Jointユーザー DawnBringer が設計した16色パレット、Lospecダウンロード数9,992超
• DB16の16色カラーコード例：#140c1c, #442434, #30346d, #4e4a4e, #854c30, #346524, #d04648 など

なぜ16色？ハードウェアが生んだ制限の意味

4ビットで16通りの色を扱う発想は、見た目の単純さとは裏腹に、メモリと描画速度の両方を節約するための合理的な設計でした。
1バイトで2ピクセルを管理できるため、限られた容量でも画面全体を素早く更新しやすく、当時のハードウェアではこの効率が表現の幅そのものを決めていたのです。
色数の少なさは妥協ではなく、仕様に合わせて画面を組み立てるための前提でした。

スーパーファミコンは32,768色の中から16色×8パレットを設定して使う仕様で、実際には実質15色に背景色1色を加えた組み方になります。
ここで重要なのは、選べる色の総数よりも、同じ画面の中でどの16色をどう割り当てるかという設計でした。
豊富な母数を持ちながら、表示単位では厳しく制限する。
このギャップが、色を絞る判断を自然に鍛えていきます。

ファミコンの8×8ドットのチップ1枚に4色まで、しかも透明色を含むため実質3色しか使えない制約は、さらに過酷です。
1キャラや1タイルごとに情報を圧縮する必要があるので、輪郭の強さ、明暗の分け方、差し色の置き方がそのまま読みやすさに直結しました。
細かなグラデーションに頼れないぶん、形と色面の切り分けが主役になるわけです。

現代ではPICO-8ファンタジーコンソールが128×128ピクセル・固定16色パレットという条件で、インディーピクセルアートの標準的イメージを作りました。
ZepことJoseph Whiteが示したこの枠組みは、古い制約を懐古ではなく制作ルールとして再定義した点に価値があります。
色を増やすより、少ない色でどう見せるかを先に決める。
その姿勢こそが、16色をいまも生きた基準にしているのです。

HSVモデルで色を読み解く——RGBより先に覚えるべき理由

HSVは、Hue（色相 0-360°）、Saturation（彩度 0-100%）、Value（明度 0-100%）の三軸で色を整理する考え方です。
色を「どんな色か」「どれくらい鮮やかか」「どれくらい明るいか」に分けて見られるので、配色の判断が一気にしやすくなります。
RGBは光の足し算で数値の意味が直感に結びつきにくい一方で、ドット絵コミュニティではHSV思考が標準になっています。
こうした扱いやすさが、その背景にあるのです。

カラーランプを組むときは、明度を左から右へ均等に上げていき、中央付近で彩度をいちばん強く置くとまとまりやすくなります。
暗い側では彩度を少し抑え、明るい側へ進むほど抜け感を出すと、立体感が自然に立ち上がるでしょう。
逆に明度だけを並べた素直な直線では、色が平板に見えやすい。
中間で色の勢いを作ることで、陰影と鮮やかさの両方が画面に残ります。

無彩色の白・黒・グレーをそのまま増やすより、ほんの少し色味を乗せたほうが、ドット絵らしい温度が出ます。
たとえば影を青や紫に寄せると、単なる暗さではなく空気感として読めるようになるはずです。
16色前後の限られたパレットでは、このわずかな色偏りが画面全体の印象を決めます。
だからこそ、色を消すのではなく、少しずつ色相を含ませながら整理していきましょう。

ヒューシフト——影と光を色相でずらすプロの技法

ヒューシフトは、影色をただ暗くするのではなく、青や紫の方向へ色相をずらして立体感を強める技法です。
明度差だけでは塊として見えやすい面も、影にわずかな寒色が入るだけで空気の層が感じられるようになります。
ドット絵で「暗い場所」を作るのではなく、「光の届き方が違う場所」を作る発想だと捉えるとわかりやすいでしょう。

晴天昼間の屋外で影が青く見えやすいのは、空からの青い散乱光が影面に乗るからです。
つまり寒色の影は気分の演出ではなく、実景に根拠のある見え方です。
暖色の光源に寒色の影、寒色の光源に暖色の影という対比を置くと、画面の温度差がはっきりし、少ない色数でも奥行きが生まれます。
光源の色を見て影を逆方向へ振る。
この基本が、配色を一段引き上げます。

この考え方をパレット設計に落とし込んだ例が DawnBringer 16（DB16）です。
Pixel Joint作者は、DB16が光と影を暖色と寒色で使い分けるよう設計されていると説明しています。
実際、色相の離れた組み合わせを最初から持っているので、暗部を灰色で埋めずに済み、塗り分けの段階で自然にヒューシフトを組み込めます。
おすすめです。

Slynyrd（Raymond Schlitter）のPixelblogで解説されるカラーランプの『hue shifting』も同じ発想です。
暗部は青寄り、明部は黄寄りへずらし、中央でつながりを保ちながら両端の温度差をつくる。
こうすると、単純なグラデーションよりも素材感が出て、金属、肌、布のどれにも応用しやすくなります。
色を並べる前に、どの方向へ振るかを決めてみてください。

16色パレットの設計手順——実践ステップガイド

16色パレットは、まず主役の色を1〜2色に絞るところから組み立てると崩れにくいです。
ベースカラーが決まれば、HSVで明るい側と暗い側に振った3〜4段のランプを作るだけで、影とハイライトの役割が明確になります。
ここで色数を増やしすぎると、どの色が本筋なのか見えにくくなるので、最初の段階では「少ない色で階調を持たせる」ことに集中しましょう。

次に、色相環の三等分であるトライアドか、補色分割のスプリットコンプリメンタリーで全体の骨格を決めます。
16色以下という制約では、同系色だけを増やすより、離れた色相を少数だけ混ぜたほうが画面が締まりやすいのです。
肌、服、背景のように役割を分けるときも、3つの色相軸があると整理しやすいでしょう。
おすすめです。

無彩色は白・黒・グレーをそのまま並べるより、わずかに青みや赤みを帯びたニュートラルカラーを1〜2色入れたほうがなじみます。
完全な無彩色は便利ですが、面積が広がると温度感が消えやすいからです。
たとえば暗部に青みのある中立色を置くと、影が空気を含んだように見えますし、赤みのある中立色は肌や木材の近くで柔らかく働きます。

透明色（ヌキ色）はパレットの先頭に置き、スプライトパーツごとに色グループを並べて管理します。
先頭に固定しておくと、作業中に透明色を実色と取り違えにくく、キャラや小物ごとの参照もしやすくなるからです。
IndexedモードでPhotoshopやAsepriteの自動減色をかけたあとは、主要面積色を手動で保護し、崩れた境界や濁った中間色を整えましょう。
自動処理は出発点であって、最後の画面を決めるのは手作業です。

有名パレットを解剖する——PICO-8・DB16・GameBoyから学ぶ

PICO-8パレットは、ZepことJoseph Whiteが設計した128×128表示専用の固定16色で、隠しパレットを含めると計32色まで扱えるのが面白いところです。
単なる懐古ではなく、「見せる前提の少数色」に設計を寄せた例なので、色数を増やすより先に役割を決める発想が身につきます。
明暗の段差がはっきりしているため、スプライトの輪郭やUIの区切りも読み取りやすい。
制約がそのまま画面設計の基準になるわけです。

DawnBringer 16（DB16）は、Lospecでのダウンロード数9,992超という定番ぶりが示す通り、実戦投入しやすい16色パレットです。
色間の色空間的距離が大きく、彩度差によるコントラストが効くので、似た色同士が濁って見える失敗を起こしにくいでしょう。
影を灰色で埋めず、寒色寄りの暗部と暖色寄りの明部を並べるだけで画面が締まる。
ヒューシフトの練習台としても扱いやすく、おすすめです。

GameBoyパレットは、最暗 #0f380f、暗 #306230、明 #8bac0f、最明 #9bbc0f の4色グリーンだけで構成されます。
ここまで絞ると、色の派手さではなくシルエットと明度設計が勝負になるので、面の切り方、エッジの置き方、余白の取り方まで露骨に問われます。
色が少ないほど誤魔化しが効かない。
だからこそ、1ピクセル単位の判断がそのまま完成度につながるのです。

実例を探す場所としては、Lospec（lospec.com）が強いです。
4,200超のパレットデータベースを無料公開しており、6形式でダウンロードしてAseprite等に即インポートできます。
既製パレットを見比べると、色数の違いだけでなく、どこを似せてどこを離すかという設計意図まで読み取れるはずです。
触ってみてください。
自作の配色にも、そのまま骨格として流用しやすくなります。

Asepriteでパレットを管理する実践ワークフロー

Asepriteは有料で約$20の定番ツールですが、オープンソースフォークのLibreSpriteもあり、こちらは.aseファイル互換で無料利用できます。
まず環境を揃えたら、既存の素材を触りながらパレットの扱いを覚える流れが実用的です。

Asepriteの「キャンバスからパレットを作る」を使うと、既存イラストから使用色を自動抽出して16色パレットを生成できます。
完成イメージに近い絵を元に色を拾えるので、ゼロから配色を悩む時間を減らしやすいのが利点です。
自分で選んだ色ではなく、実際に画面で使われている色が並ぶため、影と中間色の関係も把握しやすくなるでしょう。

Lospecからダウンロードしたパレットは、.gpl/.pal形式のままAsepriteにインポートして使えます。
異なるパレットを読み込んで比較すると、DB16のように色相差を強く取る設計と、より落ち着いた構成の差が見えてきます。
まずはひとつ取り込み、色数と役割の配分を確認してみてください。

パレットを運用する段階では、スプライトパーツ別にカラーグループを整理しておくと後が楽です。
髪、肌、服、装備のようにまとまりを分けておけば、色相を入れ替えるだけで別バリエーションを量産できます。
色を1枚ずつ塗り替える作業を減らせるので、制作速度だけでなく統一感も保ちやすくなる。
おすすめです。

よくある失敗と改善パターン——色が濁る・バラバラに見える原因

色数が多すぎると、どの色も主張が弱くなり、画面全体の統一感が一気に崩れます。
1スプライトに8色前後を目安に絞ると、主役色、影色、差し色の役割が整理され、迷いなく塗り進めやすくなるでしょう。
最初から色を増やすのではなく、必要な色だけを残す発想に切り替えてみてください。

暗い色を単純に黒へ寄せるのも、濁りやすい典型です。
純粋な黒・白・グレーは便利に見えて、面積が広がるほど金属っぽさや空気感を消してしまいます。
そこで、暗部は彩度のある暗色に置き換えます。
青みのある影、赤みのある影のように、色味を少し残したほうが、少ない色数でも奥行きが出るのです。

同じ色相の中だけで明暗を作る「ストレートランプ」も、単調に見える原因になります。
明るくするほど色相が詰まり、暗くするほど塊に見えやすいので、途中でヒューシフトを加えて、影は寒色寄り、明部は暖色寄りへ振ると自然なグラデーションになります。
色の移り変わりに温度差が入るだけで、面の立ち上がり方がぐっと滑らかになるはずです。

既存パレットを流用してから不要色を削除・置換するやり方も、初心者には向いています。
ゼロから16色を設計すると、似た色を重ねすぎたり、逆に中間色が足りなかったりして破綻しやすいからです。
DB16のような実績あるパレットを土台にすると、色空間の離れ方や暗部の扱いに基準ができ、調整の方向も見えやすくなります。
まずは借りて、そこから整えましょう。