カラーコード変換ツール Ver3

カラーコード変換ツールについて

使い方

基本的に、気になったところをクリックすれば、その色の色コードを調べることができます。

Hex(16進数)からRGB(10進数)に変換したい場合は、Hexに直接カラーコードを入力するか、画面上部のカラーピッカーで色を選択して下さい。

例えば、RGB(10進数)からHex(16進数)に変換したい場合は、R、G、B、それぞれに10進数でRGB値を入力して下さい。

色コードをコピーしたくなったら、画面上部のナビバーの、コードの部分をクリックして下さい。

補色と反転色

補色は、色相環上の正反対に位置する色です。メインカラーに対するアクセントカラーの候補となります。

反転色は、カラースケール上のRGB値を反転させた色です。こちらもメインカラーに対するアクセントカラーの候補となります。

HSVとHSL色空間

HSV、HSL値におけるSは「彩度」です。この値を減らすと、薄くなり、背景色として使いやすくなります。

HSV値におけるV、HSL値におけるLは「明度」です。この値を減らすと、メインカラー、アクセントカラーとして使いやすくなります。

HSL値におけるSは「明度」です。この値を減らすと、薄くなり、背景色として使いやすくなります。

スペシャル・サンクス

補色、反転色の抽出は、川上武範さんが公開している[color-complement.js]のアルゴリズムを利用させていただきました。

Hex、RGB、HSV、CMYKの変換については、Heather Arthurさんが公開している[color-convert]のアルゴリズムを利用させていただきました。

カラーピッカーは、Brian Grinsteadさんが公開している[spectrum]を利用させていただきました。

ランダムに色を抽出する機能は、David Merfieldさんが公開している[randomColor]を利用させていただきました。

各ウェブサービスのブランドカラーについては、Pierre Reimertzさんが公開している[brand-colors]に、私が独自に、日本の各ウェブサービス(LINE、はてブなど)を加えて一覧表を作成しました。

Flat UI Colorの色リストは、Ben Mildrenさんが公開している[flat-ui-colors]を利用させていただきました。

注意事項

各色コードは、完璧な互換性がありません。あくまでも、参考として、ご利用下さい。