Adobe公式カラーマッチングツール

Adobe公式カラーマッチングツール 138

優れた配色はデザインにおいて重要な要素です。デザインを学んでいる皆さん、特に理系出身で体系的に配色を学んだことがなく色に対する感覚が弱い学生にとって、配色選びは絶望的に感じることも少なくありません。そこで今日は、Adobeの自社ツールでもある最強の配色ウェブサイト「Adobe Colors」をご紹介します。サイトは知っていても機能まで把握していない方も多いと思うので、簡単にご説明します。https://color.adobe.com/

#创作工具 #调色配色 #配色ツール

Adobe公式カラーマッチングツール紹介

優れた配色は、デザインにおいて重要な要素の一つです。デザインを学ぶ皆さん、特に理系出身の学生の中には、配色を体系的に学んだことがなく、色彩感覚も乏しいという方も多いでしょう。そのため、配色の段階で絶望感を覚えることも少なくありません。そこで本日は、Adobe の親とも言える最強の配色ウェブサイト「Adobe colors」をご紹介します。このサイト自体を知っている方は多いかもしれませんが、実際にどのような機能が備わっているのかは詳しく知らないかもしれません。本日はその機能を簡単にご説明いたします。

https://color.adobe.com/

Adobe公式配色ツール(図1)

第一のセクション:配色モード

Adobe colors には非常に強力な配色モードが搭載されており、全部で9種類のスマートカラーモードが用意されています。色調整の方法に応じて左側のボタンをクリックするだけで操作可能で、カラーも4つのモード(RGB、CMYK、HSB、LAB)に対応しています。

例えば、単色で配色を行いたい場合は、単色ボタンを直接選択して調整するだけで、自動的に色の値が調整されます。以下の通りです:

Adobe公式配色ツール(図2)

第二のセクション:テーマ抽出機能

パソコン内の画像を直接アップロードして色を抽出することができます。アップロード後は、必要なカラーシーン(カラフル、ツーカラー、ソフト、濃色、暗色)を選択することも可能で、非常に便利な機能です!

Adobe公式配色ツール(図3)

第三のセクション:グラデーション

アップロードした画像からグラデーションカラーを抽出することができます。抽出されたグラデーションはとても洗練された仕上がりになり、グラデーション作成が苦手な方には大きな福音となるでしょう。多くのデザイナーがグラデーションを作る際、若干「汚い」仕上がりになってしまうことがあるからです。左側のボタンでは、2〜15個のグラデーションのポイントを選択することもでき、とても便利です。

Adobe公式配色ツール(図4)

第四のセクション:ツールによる補助

2つの色のコントラストを適切にチェックすることができます。プレビューでは、どのような場面でそのような色の使い方ができるのかを確認でき、もちろん右側には色の提案も表示されます。また、自分でコントラスト比を設定して色を調整することも可能で、これを使えばもう色が汚く安っぽく見えることはなくなります!

コントラスト比の目安:MD規範によると、テキストは明度差を計算した上で少なくとも4.5:1のコントラストを保ち、テキストの鮮明さを維持すべきとされています。最適なコントラストは7:1です。

Adobe公式配色ツール(図5)

第五のセクション:探索とトレンド

「探索」をクリックすると、良質な画像を閲覧でき、その中からカラーパレットを抽出することができます。「トレンド」をクリックすれば、Behance上の異なるデザイン分野のデザイン作品で使用されている配色方案を閲覧することもできます。すごいデザイナーたちの配色に従えば間違いはなく、リアルタイムでトレンドの配色をチェックできます。本当に素晴らしいです!!!

Adobe公式配色ツール(図6)

もちろん、検索機能も利用できるので、自分好みの画像や色を素早く見つけることができます。個人的にはムードボードを探す際にこのツールを非常に気に入って使っています。色が一目でわかるだけでなく、画像自体も非常に高品質です!

Adobe公式配色ツール(図7)

総じて、このウェブサイトは配色のニーズをあらゆる角度から満たしてくれるだけでなく、イメージ探しに関する多くのニーズも解決してくれるので、まさに一挙両得です。


Adobe公式カラーマッチングツール に関連するツール