リーディングビュー

画面の色情報（HEX,RGB,HSL）の取得

ペコログ

著者:ペコネット

2025年3月4日 21:20

最終更新日 2026年1月1日

画面の色情報を知りたいことなどがある。

Webページなどを制作していると画面の色情報を知りたいことなどがある。

Chromeの拡張機能「ColorPick Eyedoropper」でブラウザ上の色情報を便利に取得していたが先日、サポート終了により機能がオフにされた。

な、なんだ… 終了か…唐突の感

これを機に「PowerToys」をインストールしてブラウザ上だけではなく、PCディスプレイ上の色情報を取得してみることにする。

PowerToysとは

Microsoftが開発するユーティリティソフトウェアでWindowsの使い勝手を向上させるさまざまなモジュール（機能）を追加することが出来ます。今回はこのPowerToysのモジュールのひとつ「Color Picker」を取り上げています。

PowerToysのインストール

Microsoftストアからインストールします。
Microsoftストアの「PowerToys」のダウンロードページ

PowerToysのダッシュボード。「Color Picker」を有効にしておく（デフォルトで有効になっています）

Color Pickerを使う

PowerToysが起動していれば（デフォルトではWindowsログインと同時に自動起動している）ショートカットで「Windowsキー」+「Shift」+「C」で「Color Picker」が使用できるようになる。

ディスプレイ上のマウスポインタの置かれている位置のHEX値が表示されるようになります。ここでは当ブログを開いて適当な位置の色を取得しています。（上画像の赤枠部分）

そのままクリックするとRGB値やHSL値も表示されます。

仮想プリンターで画像出力

ペコログ

著者:ペコネット

2025年2月27日 20:54

最終更新日 2025年5月6日

ドロー系のアプリケーション（花子など）は、印刷を前提、基本としているためかペイント系のキャンバスのようにピクセルで用紙設定をすることが出来ないものが多い。

ドロー系のアプリケーション

ドロー系のアプリケーション（花子など）は、印刷を前提、基本としているためかペイント系のキャンバスのようにピクセルで用紙設定をすることが出来ないものが多い。（同じくドロー系のAdobe Illustratorのようにピクセルで用紙（キャンバス）設定が出来るものもあるが…）

上画像は、花子を使用してA4の用紙にさまざまな文字や画像を配置して資料のようなものを作成。このままJPEGなどに出力したい…

コンピュータディスプレイ上で扱う画像の出力

たとえば基本的にはドロー系のグラフィックアプリケーションである花子の場合、Web用の素材などを作成するには、用紙上で範囲の指定をするかオブジェクトを選択することによってピクセルによる解像度を指定して出力することは出来るが、この用紙そのものをプリンターで印刷するように画像で出力することが出来ないのは困る場合もある。

仮想プリンターを使用する

仮想プリンターとは、Adobe Acrobatに代表されるような印刷イメージをファイルとして出力するコンピュータ（ネットワーク）上の仮想的なプリンター機能だが（一般的にはPDFを出力。WindowsにはMicrosoft Print to PDFが標準搭載されている）JPEGやPNGに変換して出力出来る仮想プリンターもある