Web Design

Webデザイン「配色パターン」色で迷った時に参考になるサイト

Webデザインで「配色パターン」に迷った時に参考になるサイトを紹介します。

Webデザイン「配色パターン」参考サイト

Webサイトのデザインで重要な「配色」選びに役立つサイトを紹介します。サイトの印象が決まるイメージカラーやアクセントカラーを選ぶ時、バナー作成の時などに参考にしている「色見本」や「配色パターン」のおすすめサイトを厳選しました。配色に迷った時にとても役立つので、ブックマークに入れておくと便利です。

Color Hunt

◾️https://colorhunt.co
「Color Hunt」は、配色のパターンが参考になるサイトです。4色の配色パターンがたくさん見れるので色に迷ったらとりあえず、このサイトから見ていきます。配色の組み合わせや色の相性などを全体的に見れるので、とてもオススメです。

配色の見本帳

◾️https://ironodata.info
選んだ色を「キーカラー」にして色の法則から多彩な配色を提案してくれます。Webカラーをベースに色数値情報も掲載されていて、他にも「カラー分析」や「配色展開」などもあります。色を展開したいときや新しい色の組み合わせと出会いたいときは「配色の見本帳」がオススメです。

原色大辞典

◾️https://www.colordic.org
色の名前やカラーコードが一目でわかる「WEB色見本」で、ブラウザで名前が定義されている140色の色名と16進数がわかります。「現色大辞典」は、9種類の色見本と色に関する各種サービスから構成されています。 色見本コンテンツは ブラウザで定義されているHTMLカラーネーム、 日本の伝統色、 世界の伝統色、 Webセーフカラー(216色)、パステルカラー、 ビビッドカラー、 モノトーン、 地下鉄のシンボルカラー、 国鉄制定の塗装色の9つから構成されています。

HUE/360

◾️http://hue360.herokuapp.com
「HUE/360」は、色相、彩度、明度を直感的に操作しながら色の組み合わせを探す事ができます。色を選ぶと相性の良い色を提案してくれます。選択された色が画面の下部に表示されて、他の色と比較したりもできます。

shade

◾️https://jxnblk.com/shade/
「shade」は、カラーコードを入力してベースカラーを決めると、自動的に「グラデーション」を生成してくれるツールです。グラデ好きはチェックしてみて下さい。

Flat UI Colors

◾️https://flatuicolors.com
「Flat UI Colors」は、フラットデザインに使える色を選べるツールです。パレットを選択して、色をクリックするだけでカラーコードがコピーできるので、とても便利です。

この記事が気に入ったら
いいね ! しよう

Twitter で