カラーパレットジェネレーター
スペースキーを押すと新しい配色が生成されます。残したい色をロックして、残りをシャッフル。調整し、アクセシビリティを確認して、気に入ったら書き出しましょう。
カラーパレットの作成方法
- 「生成」ボタンかスペースキーで新しいパレットを作ります。構成を決めたいときは、先にアナロガス、トライアド、補色などのハーモニーを選びます。
- 気に入った色はロックアイコンでロックします。ロックした色は残り、ほかの色だけが変わります。HEX コードをクリックすると好きな色を入力でき、矢印で並べ替えもできます。
- 「調整」では色相、彩度、明るさをまとめて動かせます。「シェード」では 1 色のティントやシェードを選べ、「アクセシビリティ」ではコントラストと色覚の確認ができます。
- パレットは CSS、SCSS、Tailwind、JSON、SVG、PDF、デザイントークン、Swift、Android、Flutter のコードなどで書き出せるほか、この端末に保存できます。
できること
ロックとシャッフル
好きな色をロックして、生成を続けられます。元に戻す・やり直すで、以前のパレットにさかのぼれます。
ハーモニーモード
ランダム、アナロガス、モノクロマティック、トライアド、補色、スプリットコンプリメンタリー、テトラードのパレットを生成できます。
2 色から 10 色まで
色を追加・削除して、2 色から 10 色までのパレットを作れます。
アクセシビリティの確認
コントラストマトリクスですべての組み合わせの WCAG と APCA の結果を確認できます。色覚チェックでは、1型色覚（protanopia）、2型色覚（deuteranopia）、3型色覚（tritanopia）で見分けにくい色を知らせます。
条件指定
読みやすい文字の組み合わせ、色覚特性への対応、除外する色相など、パレットが満たすべき条件を指定すると、それを満たすパレットを生成します。
プレビューとプレゼン
ビジュアライザーで Web サイトのモックアップに当てはめて確認したり、Studio でカラーシステムを作ったり、全画面で表示したりできます。
よくある質問
カラーパレットジェネレーターとは？
カラーパレットジェネレーターは、相性のよい色の組み合わせを作るツールです。パレットを生成し、気に入った色を残して、ブランド、インターフェース、イラストに合うまで残りを変えていきます。GetColors はアナロガスやトライアドといったハーモニーの規則に沿ってパレットを作れるので、色同士がランダムではなく関連したものになります。
配色はどうやって作る？
ジェネレーターを開いて、スペースキーか「生成」ボタンを押します。押すたびに新しいパレットができます。残したい色をロックしてからもう一度生成すると、ロックしていない色だけが入れ替わります。
1 色から配色を作るには？
HEX コードをクリックして色を入力し、ロックします。次にアナロガスや補色などのハーモニーを選んで生成すると、ロックした色が残り、ほかの色がそれに合わせて作られます。画像のカラーピッカーを使えば、写真から始めることもできます。
パレットは何色まで作れますか？
2 色から 10 色までです。インターフェースやブランドに使うなら 3 色から 5 色が扱いやすく、グラフやイラスト、幅広いティントが必要なときは、もっと多く使いましょう。
作ったパレットを保存・共有できますか？
はい。パレットはページのアドレスに保存されるので、リンクをコピーすれば共有できます。「保存」でこの端末に残せるほか、書き出しダイアログでは多くの形式のコードやファイルを選べます。