CSSを弄るときには必須!1600万色の色見本が見られる「Color-Sample.com」

acrylic-paints-174638_1280_mini

さくっとRGB値やHEX値を知りたい時ってありますよね

WebサイトのCSSやスマホアプリを開発していると、色の値を調べたい時ってありますよね。

例えば、このブログに使っている水色っぽい色は#0bdです。

デザイナーさんが近くにいれば、画像編集ツールなどを使って調べてもらえるのでしょうが、なかなかそうも行かないことが多いです。

といいますか、そもそも青色や赤色など、大まかなイメージはあっても、具体的にはどのような色があるのかよくわかりません。

 

というわけで、大量の色見本を見られるサイトをご紹介させて頂きます。

 
色見本と配色サイト – color-sample.com

 

 

大量すぎて逆に選べないかも…

このサイト、何が凄いってその情報量の多さです。

例えば青系の色を選びたいとしましょう。

ページ上から「青」を選択します。

するとこんな感じで表示されます。

 

スクリーンショット 2015-01-14 22.08.09

 

まずは青系等の画像をFlickrとInstagramから探してきてくれます。

 

で、特に約に立ちそうなのがこちら。

 

スクリーンショット 2015-01-14 22.08.28

 

同系統の色を使ったWebサイトを表示してくれます。

これは、例えば非開発者の人と、デザインのイメージを詰めるのに役立ちそうです。

この色を使うとだいたいこんなイメージになりますよ、っていう感じですね。

というか、これ人力で探されているのでしょうか…?

凄い情報量です!

 

スクリーンショット 2015-01-14 22.08.41

 

そして最後に色見本が表示されます。

まず全部の色に名前が付いていることにびっくりですよ。

世の中には1600万以上の色の名前があるってことになりますよね…。

 

スクリーンショット 2015-01-14 22.14.04

 

色を選択すると、このように詳細情報が表示されます。

HEX、RGB(sRGB)、RGB(AdobeRGB)の3つが確認できれば、大抵は十分でしょう。

と言うか、それとCMYK以外は知らないんですけど…。

色の世界は奥が深いですね。

 

まとめ

プログラマーなら十分。デザイナーでも足りるのかな?

プログラマーがコーディングの際にちょこっと調べるだけなら十分でしょう。

デザイナーさんの世界はよく知らないのですが、何しろ1600万色もあるのですから十分なのではないでしょうか?

 

今回は以上!

zbogom!!