ピン
カラーピン
コピーした色の値を色見本として画面に置き、RGB、HSV、HSL、HEXの数値を同時に確認して、必要な形式でコピーする方法を説明します。
カラーピンは色の値を色見本として表示し、RGB、HSV、HSL、HEXの数値を併記します。複数の色を画面に並べて配色の参考にしたり、色形式を変換したりできます。
カラーピンの作成
#0485F7などの色の値をコピーし、Ctrl+2⌃ Control+2を押します。
スクリーンショット中にカラーピッカーでコピーした値も同じ方法で使えます。
対応する色の表記
コピーした文字が次のいずれかの場合、カラーピンになります。
| 表記 | 例 |
|---|---|
| HEX | #0485F7、#08F |
| CSS色関数 | rgb(4, 133, 247)、rgba(4, 133, 247, 0.5)、hsl(208, 97%, 49%) |
| CSS色名 | red、skyblue |
| カンマ区切りの数値 | 4,133,247、4,133,247,128（各値0～255） |
それ以外の文字はテキストピンになります。
カラーピンの情報
#0485F7
RGB: 4, 133, 247
HSV: 208, 98, 97
HSL: 208, 97, 49
HEX: 0485F7
上から色見本、コピーした元の文字、RGB、HSV、HSL、HEXの数値が並びます。rgba(4, 133, 247, 0.5)のように透明度がある色では、RGBがRGBAになり、透明度の値も表示されます。
別の形式でコピー
カラーピンを右クリックすると、各形式と数値がメニューに並び、クリックでコピーできます。#0485F7の例：
| メニュー項目 | コピーされる内容 |
|---|---|
| RGBをコピー: 4,133,247 | 4,133,247 |
| RGBをコピー: 0.016,0.522,0.969 | 0.016,0.522,0.969（0～1の小数） |
| HSVをコピー: 208,98,97 | 208,98,97 |
| HSLをコピー: 208,97,49 | 208,97,49 |
| CMYKをコピー: 251,118,0,8 | 251,118,0,8（各成分0～255） |
| HEXをコピー: 0485F7 | 0485F7 |
| HEXをコピー: #0485F7 | #0485F7 |
「RGB:」などの接頭辞を含まず数値だけをコピーするため、デザインソフトウェアやコードにそのまま貼り付けられます。