
カラーリングの参考サイトまとめって見ちゃうよね…(後編)
さて、前編からの続きですね。前編では、「いろんな色を見たいとき」と「
「色の組み合わせを考えるとき」の大きく2つを取り上げました。だいたいの配色に関しては、前編でも問題ないかとは思います。きっと、多分…。
後編では、特定の用途といいますか、ある点に特化したサイトを紹介していきたいと思います。色の組み合わせだけでカラーリングが済めばいんですけど、そうはいかない場合もあるのが悩みどころ。そんな時に頼りにするサイトたちをご紹介いたします。
4. グラデーション
ここ最近、パール系のグラデーションをよく見かけませんか?すごい人気ですよね。いろんなところで見るような気がします。さて、そんな流行のクラデーション関係については、私は以下の3サイトをよく使います。
-WebGradients -
「WebGradients」はローディングが可愛いので、出ては入ってを繰り返しています。ワクワクするデザインって大事ですよね。あと、それぞれのグラデーションに名前がついていてかわいいなと思います。私は基本的に、PNGをダウンロードしていますが、CSS、Sketch、Photoshopもダウンロードできるようになっています。
- CoolHue 2.0 -
「CoolHue 2.0」は、配色パターンの数はそれほど多くありませんが、JavaScriptのオブジェクトとしてレンダリング(アプリケーションソフトなどが、画面に表示すべき内容を与えられたデータから計算しながら描き出すことを言います。つまりはJavaScriptにそのままコピーすればすぐに使えるよ!という状態ですね)されており、コードベースでも利用することもできます。
他にもいいサイトはあるんですけど、SketchやPhotoshopへのプラグイン(本来あるソフトウェアに機能を拡張させるために追加するプログラム のことですね)もあるので便利なんですよね。
- shade -
一方、「shade」は自分でグラデーションを作ることができるツールです。カラーコードを入力してベースカラーを決め、色やグラデーションの各種値を調整して作成します。作成した色のCSSプロパティ(ファイルやフォルダ、オブジェクトなどの特性をあらわすデータです)が表示されるのが便利です。自分好みの色を作るときに非常に便利ですね。
5. ブランドカラー
各ブランドのカラーを参照できるサイトたちです。有名ブランドともなると、凄腕のデザイナーがものすごい時間をかけて選んだ至極の1色!!!みたいなものもあると思うので、配色を考えるときに非常に参考になります。
- BrandColors -
「BrandColors」はそのままの意味ですね。ブランドカラーとその色のカラーコードが確認できるようになっています。特に各ブランドごとの色の規約が見れるのはすごく助かります。いや、本当に、色の規約を探し当てるのがどれほど大変か…なんであんな分かりづらい場所にみんな置くんだ…デザイナーぐらいしか見ないからか…そうなのか…
- Web colour Data -
「Web Colour Data」はURLを入力すると、そのWebサイトで使われている配色を取得してくれるWebツールです。ベースカラー、アクセントカラーもわかるようになっているので、ホームページの色を決めるときなど参考になると思います。もしデザイナーなら、「お客様の同業他社のホームページfがどんな配色をしているのかなぁ?」なんかを見るのにちょうどいいと思います。
6. おまけ
- Werner’s Nomenclature of Colours -
実用的と言われると微妙なところですが、ヴェルナーの色辞典「Werner’s Nomenclature of Colours」のweb版は見ていて楽しいと思います。18世紀のおわり、ドイツの地質学者アブラハム・ヴェルナー(英: Abraham Gottlob Werner)が、110色におよぶ色を分類するガイドラインを考案しました。出版は1814年。それを、スコットランドの画家パトリック・シム(英: Patrick Syme)が1821年に改訂。ですので、ざっと200年ほど前の色辞典になります。かの進化論で有名なチャールズ・ダーウィンもビーグル号での航海中に、このガイドブックを持参していたそうです。
- NIPPON COLORS -
「NIPPON COLORS」は和色に特化したサービスです。一つ一つ見ているだけで楽しくなってしまいます。色が変わる際に、じんわりにじみ出るように変化するのでそれもテンションが上がりますね。和風のページを作る時にはぜひ参考にしたいサービスです。
7. まとめ
ここまでの長い間、お読みいただきありがとうございます。いや、本当にこんなに長くなるとは思わず…「色」について話すと長くなってしまいますね。後半部分を書き始めたくらいから「これは長いのでは??」と後悔の二文字がよぎりましたが、なんとかやり遂げました。この記事を読んだ迷える配色の民が、少しでも早く帰宅できることのお助けになれれば幸いです。