カラーツール

色から作るパレット

色をひとつ選ぶと、それに合うカラーパレットが手に入ります。調和の種類、色数、トーンの広がりを選んでください。16進コードをコピーするか、エディタで開くか、ライブラリに公開できます。

基準色
配色
色 6
トーン

ベースカラーと色相環の反対側の色 — 最大のコントラスト。

6色
#003FF7
#4F7CFF
#A6BDFF
#F7B800
#FFD24F
#FFE8A6

テーマ (任意)

ログインすると公開ライブラリに投稿できます。

1色からパレットを作る

ひとつの色から始めると、このツールが その色を起点にしたカラーパレット を色彩理論の法則に沿って作ります。調和の種類を選び、色数とトーンの広がり方を決めると、合う色が色相環から計算されます。勘で選ぶのではないので、実際にまとまります。ドット絵、ゲームUI、Webサイト、ロゴなど、1色のブランドカラーに脇役が必要なデザインにぴったりです。使いたい色が写真の中にありますか?まずは 画像カラーパレットツール で抜き出してから、それを軸にパレットを組み立てましょう。

配色の種類

  • 補色 — 選んだ色と、色相環の反対側にある色。大胆で対比の強い組み合わせ。
  • 類似色 — 隣り合う色どうし。落ち着いていて自然、目にやさしい配色。
  • トライアド・スクエア — 色相環を等間隔に分けた3〜4色 — 鮮やかなのにまとまります。
  • 分割補色 — ベースの色と、その補色の両隣にある2色 — 対比はやわらかめ。
  • モノクロ — ひとつの色相を彩度と明度で振り分けたもの — すっきりしたトーン配色。
  • 明暗のバリエーション — 選んだ色を、濃いシェードから明るいティントまで段階的に。

使い方

  • ピッカーで基準の色を選ぶか、16進コードを貼り付けます。
  • 調和の種類を切り替えて、パレットを並べて見比べます。
  • 色数とトーンの広がりを好みに合わせて設定します。
  • どの色見本も編集できます。仕上がったら16進コードをコピーしてプロジェクトへ。
  • パレットをエディタで開く ですぐに描き始められます。
  • 公開先 パレットライブラリ に置いて、再利用したり共有したりできます。

よくある質問

1色からカラーパレットを作るには?
ベースカラーを選び、ハーモニーを選んでから、色の数とトーンの幅を設定します。合う色は色相環から即座に計算されます。
ハーモニーの種類の意味は?
補色は反対側の色で強いコントラストを作ります。類似色は隣り合う色で穏やかにまとめます。トライアドとスクエアは色を均等に配置して鮮やかなバランスに。モノクロームとシェードは1つの色相のトーンを変化させます。
色の数は選べますか?
はい。パレットは2〜16色に設定でき、トーンのレベル(控えめ・中・強め)で明暗の幅を調整できます。
無料ですか?
はい、完全無料で登録も不要です。公開ライブラリにパレットを公開する場合のみアカウントが必要です。
生成された色は編集できますか?
はい。スウォッチをクリックして調整し、色を追加・削除してから、HEXコードをコピーしたり、エディターで開いたり、公開したりできます。
パレットはどこで使えますか?
HEXコードをデザインやゲームのプロジェクトにコピーしたり、ピクセルアートエディターで直接開いたり、ライブラリに保存して後で再利用したりできます。