画面上の色をカラーコードorRGBで取得したい(ペイント使用)【備忘録】

お疲れ様です。

タイトルの通り画面上に映っているものから色情報を取得する方法についてメモです。
アプリの作成時などに設計書のイメージ通りの色を取得したい!という時によく使っている方法です。

Windowsのペイントを使った方法になります。(なのでWindows向けです。)
社内PC等でソフトのインストールに制限があるときなどに、Windowsの標準の機能だけでできるので個人的には重宝しています。

方法

  1. 色を取りたい範囲のスクリーンショットを取る
    Windows + Shift + S」で範囲指定スクリーンショットを取ります。 今回は試しにVSCodeのロゴの部分を使ってみます。

example

Windows + Shift + S」についてはこちら参考↓
atmarkit.itmedia.co.jp

  1. ペイントのキャンバスに貼り付け
    先ほどの範囲指定スクリーンショットクリップボードにあるのでそのままペイントに貼り付けできます。
    「Ctrl + V」のコマンドかペイント内の貼り付けの機能を探してキャンバス内に貼り付けます。

paste

  1. カラーピッカーで色取得
    ペイントのカラーピッカーで色情報を取得します。

picker

取りたい色の範囲が小さい場合は拡大して取りましょう。VSCodeのロゴの青色の部分を取ってみます。

expand

  1. 「色の編集」からカラーコードやRGB値を取得
    色の編集の項目からカラーピッカーで取得した色情報を確認できます。
    カラーコードやRGB値をこれで参照できます。

edit

color

あまり使うことはないかもしれませんが、一応HSV値を取得することも可能です。

color2