色選びに困ったときに役立つサイトです。

んにちは。栃木県宇都宮市で完全返金保証型のホームページ制作をやっとります

ハッスルウェブのマックスです。

 

ほとんどオフィス化している?

スタバでホットのソイココをすすりながらブログを書いております。

 

もう六月だというのに、性懲りもなくホットを頼み続ける私に、

「ホットで、、よろしいん、、ですよね??」なんて聞き返される機会も多くなって来ました笑

 

そうなんです。わたくしエセ健康マニアなので、

なるべくカラダを冷やさないようにしている、女子力高め?気持ち悪い36歳独身男性です。

 

っきレジの女性に、

「今日はお休みですか?いつもオシャレですね。」

なんておだてられて調子に乗っております。真に受けて、すまみせん。

 

しかし、私はオシャレではありません。(まだ真に受けている笑)

だって、いつもWEBサイト制作のときに【色選び】に四苦八苦しているんですから。

 

なんですが、あるサイトに出会ってからは

WEBサイトの色選びで悩むことはなくなったのです!!

 

さて、本題です。

スクリーンショット 2015-06-11 20.34.31

 

んな感じでカラースライダーを目の前にして、まったく自分のお気に入りの色に出会えない。ツマミをいじれどもいじれども、どんどん負のスパイラルに巻き込まれていく。

 

そんな経験はありませんか??

やればやるほど、自分の色のセンスのなさに自己嫌悪...。

 

きっと私だけではないはず。

あなたもきっと同じ悩みを持っていたんじゃないの??

 

そんなあなたに朗報です。

 

スクリーンショット 2015-06-11 20.37.58

 

WEBサイトの色選びの救世主!coolorsを今回はご紹介いたします。

なんかオシャレな感じでいいでしょ?いい予感がします。

 

スクリーンショット 2015-06-11 20.59.45

 

使い方はとてもカンタンです。

青枠で囲っている【HSB】のモードで使用するのがいいかもしれません。

 

WEBで色を指定するとき、ほとんどの場合は16進数のRGBカラーモードで指定することが多いと思います。でも、結構やりづらいって思ってるのは私だけではないはず。

 

しかし、このHSBカラーパレットなら【感覚重視】で色選びができるのです。

感覚人間バンザイ!!

 

HSBって何よ?

①H(色相・Hue)

②S(彩度・Saturation)

③B(明度・Brightness)

 

これら3つの要素から成り立っているカラーモデルです。

 

色相
色相環(色相の輪)、輪の形、もしくは0度〜360度の範囲で表示される。
彩度
色の鮮やかさの度合い、数値が低いと彩度が低く、高いと彩度が上がる。
明度
色の明るさの度合い、数値が低いと暗くなり、高いと明るくなる。

 

とめると、

RGBカラー
【Red】【Green】【Blue】の色数値を少しずつ調整して色を作っていく。
HSBカラー
好きな色を選んで、色の鮮やかさや濃さを調整していく。

 

というわけで、違う色をまぜまぜしてつくるRGBカラーよりも、HSBカラーはより感覚的にカンタンに色選びができるという、優しい設計になっているのです。

 

スクリーンショット 2015-06-11 20.59.50

 

色相を選んでいきます。

 

スクリーンショット 2015-06-11 21.00.02

 

彩度を選んでいきます。

 

スクリーンショット 2015-06-11 21.02.52

 

明度を選んでいきます。

 

スクリーンショット 2015-06-11 21.05.38

 

最下部に表示されている【#◯◯◯◯◯◯】をコピーします。

 

スクリーンショット 2015-06-11 21.05.55

とはさっきの記号をカラーパレットにペーストするだけ。

これでカンタンにあなたのお気に入りの色を反映することができます。

 

 

それでは今回はこの辺で。

ではまた。


The following two tabs change content below.
あずまよしのぶ

あずまよしのぶ

取締役・WEBディレクター株式会社ハッスルウェブ
←(左のカメラのアイコン)最近インスタグラム始めました!食べ物ばっかりアップしてますのでフォローしてやってくださいませ。銀座〜東京エリアのお店を中心にアップしてます。【超初心者大歓迎】なWordPress勉強会を定期開催してます。難しい言語(HTMLやCSSとか)は覚えなくても大丈夫です。気になったら来てみてくださいね。アメブロやってるかたにオススメです。