この色をあと10％暗く（明るく）したい

ウェブデザインを作っているときに、「この色をもう少し暗く（明るく）したいんだよなー」と思うことってよくありますよね。今日は、そんなときに使えるカラージェネレイターをご紹介します。

サイト自体は英語ですが、直感的に操作でき、とても簡単なので、ぜひトライしてみてくださいね。

SPONSORED LINK

それじゃ、いきますよ。Hex Color Toolというサイトを使います。


Hex Color Tool

最初の画面。ものすごくシンプルですね。

今回は「#B163A3」の10%暗い色を作ります。

ちなみに、「#B163A3」はPANTONE社が決めた2014年のトレンドカラー「ラディアント・オーキッド」という色です。





黒い六角形のロゴの下にある、6 DIGIT HEX の欄に、6文字のカラーコードを入力します。

頭に#を付けず、6文字だけを入力します。




カラーコードの頭に＃を付けてしまったり、文字数が多すぎたり少なすぎたりして、カラーコードを間違って入力した場合は、入力欄の下にエラーメッセージが出ます。

英語がニガテな人もひるまないでね！　notが付いてるとダメだと言ってるということだよ。^^




ここでは、10％暗い色を作ります。だから、Darkenにチェックを入れます。




PERCENTAGE（パーセンテージ）の部分で、何％かを指定します。バーを左右にスライドすると数値が変わります。

今回は10％でいきますので、そのままSubmitボタンをクリックします。




オリジナル（最初に入力したカラーコード）から10％刻みで暗くなる色相ができました！　とっても簡単ですね！　

カラーコードとSubmitボタンをクリックしただけというあまりに簡単な作業なので、ついでに10％ずつ明るくなるコードも作ってみましょう。^^




Resetボタンは触らずに、Lightenのラジオボタンにチェックを入れ、Submitをクリックします。




さっき作った10％ずつ暗くなる色相の下に、10％ずつ明るくなる色相ができました！


色作りはときに悩ましい作業でもありますが、この記事があなたの作業を少しでも楽しくラクにすることができたら嬉しいです。^^


人気ブログランキングへ

[参照サイト]

• Hex Color Tool