カラーピッカー

1つの色を、あらゆる表記で

デザイナーからはHEXで渡され、スタイルシートにはhsl()が必要で、印刷会社からはCMYKを求められる──。どんな値（#1e90ff、rgb(30 144 255)、dodgerblue）でも貼り付けるか、目で見て、またはスポイトで選べば、必要な表記で、CSSが求める丸め方でコピーできます。

日々の色の作業に

ブランドカラーの正確なHEXやRGBを調べる、CSSの形式どうしで値を変換する、スクリーンショットやWebページの色をスポイトで取る、デザインに合う補色を探す、試した色の履歴を残す、といった作業に使えます。

読み込める形式と書き出せる形式

HEX（3・4・6・8桁）、rgb()/rgba()とhsl()/hsla()（カンマ区切り・スペース区切りの両方）、148種類のCSSの色名を読み込めます。表示はHEX・HEX8・RGB・RGBA・HSL・HSLA・HSV・CMYK。HSLとHSVは小数点以下1桁まで保つので、変換し直しても同じ色に戻ります。スポイトはChromeとEdgeで使えます（EyeDropper API）。

色の形式の違い

HEXはWeb制作でいちばん一般的な形式で、#に続く6文字の16進数で表します。たとえば#3B82F6は青色です。8文字にすると、アルファ値（透明度）も加わります。

RGBは、赤・緑・青の成分をそれぞれ0〜255で表します。RGBAは、透明度を表すアルファチャンネル（0〜1）を加えたものです。CSSやグラフィックデザインで広く使われています。

HSL（色相・彩度・明度）とHSV（色相・彩度・明るさ）は、色を調整するのに直感的な形式です。CMYKは印刷のデザインに欠かせない形式で、シアン・マゼンタ・イエロー・キー（黒）のインクの割合で色を表します。

配色のハーモニー

配色のハーモニーとは、一緒に並べて心地よく見える色の組み合わせのことです。色相環をもとにしていて、補色は向かい合う色、類似色は隣り合う色、トライアドは正三角形を描く3色です。

調和のとれた配色を使えば、デザインにバランスと魅力が生まれます。このツールはパレットを自動で作るので、Webサイト、アプリ、グラフィックデザインに合う色の組み合わせがすぐに見つかります。