【Mac】RGB値・16進数カラー値・カラーコードを確認・調べるなら「カラー」ウィンドウで超簡単!アプリ・アップロード不要!プレビュー・Keynote・Pages・Nubersでも何でもOK!

画面や画像の色について、RGB値・16進数カラー値・カラーコードを自由に調べて使いたいという場合があると思います。

そんな時に、アプリをダウンロードしたり、WEBサイトにアップロードしたり、そういう何かしらの手間があると面倒ですよね。

PhotoshopIllustratorで調べるというのも、起動に時間や手間をかけるのが面倒ですよね。

  • 超簡単
  • 手間が少ない
  • 短時間

に調べられたら最高に良いですよね。

今回はMac標準搭載機能「カラー」ウィンドウを使用し、誰でも簡単に色のRGB値・16進数カラー値・カラーコードを確認・調べる方法をご紹介します。

 

Mac標準搭載機能「カラー」ウィンドウとは

プレビューのマークアップツールバー、Keynote、Numbers、Pages等々の標準搭載機能には色を選択する項目が必ず表示されます。

これが「カラー」ウィンドウです。Macユーザーなら誰もが見たことがあると思います。細かい色の選択をする際に使用します。

この「カラー」ウィンドウを使用してRGB値・16進数カラー値・カラーコードを確認します。

 

「カラー」ウィンドウの各機能の名称

画像:公式サイトより

「カラー」ウィンドウの上部には5つの項目があり、日本語では「ピッカーインターフェース」、英語では「Picker interfaces」と言います。

画像:公式サイトより

画像:公式サイトより

「ピッカーインターフェース」には5つの機能があります。左から順に以下のとおり。

  1. カラーホイール(Color wheel)
  2. カラーつまみ(Color sliders)
  3. カラーパレット(Color palettes)
  4. イメージパレット(Image palettes)
  5. 鉛筆(Pencils)

今回 使うのは「カラーつまみ」です。

 

余談:「カラーウェル」とは?

画像:カラーウェル

公式サイトを見ていると「カラーホイール」と一緒に、「カラーウェル」という言葉がよく出てきます。

紛らわしいのですが、「カラーウェル」は英語では「Color well」と言います。

私は最初見た時に翻訳ミスかとも思ったのですが勘違いでした。

参考:公式サイト

カラーウェル (日本語):https://support.apple.com/kb/PH16825?locale=ja_JP&viewlocale=ja_JP

Color well (英語):https://support.apple.com/kb/PH16825?locale=ja_JP&viewlocale=en_US

 

「カラー」ウィンドウを使用してRGB値・16進数カラー値・カラーコードを確認する方法:プレビューの場合

実際に標準搭載機能の「プレビュー」を使用して、それぞれの数値を確認してみましょう。

①画像を「プレビュー」から開く

「マークアップツールバーを表示」というボタンがありますので、それをクリックしましょう。

 

②マークアップツールバー内の「枠のカラー」「塗りつぶしのカラー」のどちらかをクリック

「カラーパネルを表示…」というボタンがありますので、そこをクリックしましょう。

 

③「カラー」ウィンドウが表示されます

先程もお見せしましたが、左に表示されたものが「カラー」ウィンドウです。

フォントでも図形でも、色の選択をするところではどこでも表示されます。

 

☆ちなみに「マークアップツールバー」等の手間を省いて、「プレビュー」を開いてから「shift+command+c」でも「カラー」ウィンドウは開きます。

 

④スポイトの形の「カラーピッカー」をクリックします

抽出したい色をクリックする。今回はネズミの背景の水色を抽出します。

画面全体どこでも色の抽出ができますので、抽出したいものは、画面の前面に出しておいてください。

 

⑤カラーピッカーでの抽出完了

抽出した色はカラーピッカーの横の四角の中に表示されます。

 

⑤「ピッカーインターフェース」から「カラーつまみ」をクリックする

「ピッカーインターフェース」内の左から2番目の「カラーつまみ」をクリックして切り替えましょう。

 

⑥「〇〇つまみ」の中から「RGBつまみ」を選択します

デフォルトでは「グレイスケールつまみ」になっているかもしれません。

それを「RGBつまみ」に変えましょう。

 

⑦操作完了!

これでRGB値・16進数カラー値・カラーコードが確認出来ます。

 

 

「カラーウェル」と「カラーホイール」があれば、どこからでも出来る!

画像:カラーウェル カラーホイール

ということで、「カラーウェル」「カラーホイール」があれば、どんなアプリケーションからでも出来ます。

「プレビュー」「Keynote」「Numbers」「Pages」何でもOKです!

「メモ」は色変更が出来ないので、カラーウェルもカラーホイールもありませんから出来ませんが。

「プレビュー」の様に、カラーウェルしか表示されていない場合も、②でお伝えしたとおり、「カラーパネルを表示」というボタンがあると思いますので、そちらから「カラー」ウィンドウを開いてください。

 

最後に

Macなら、アプリのダウンロードも、webサイトへのアップロードも、Photoshop・Illustratorの起動もせずに、超簡単にRGB値・16進数カラー値・カラーコードが分かってしまうんです!

再度 手順を確認します。

  1. 「カラーウェル」から、または直接「カラーホイール」を開く
  2. 「カラーピッカー」で調べたい色をクリックして抽出
  3. 「ピッカーインターフェース」から「カラーつまみ」を選択
  4. 「RGBつまみ」を選択
  5. RGBと16進数カラー値が表示される

という手順で簡単に出来ます。

  • 「shift+command+c」:「カラー」ウィンドウ表示

こちらもお忘れなくお使いになってみてください

 

ちなみに、「RGBつまみ」以外にも「CMYKつまみ」「HSBつまみ」もあり、そこからもそれぞれの値が確認できる様ですので、お試しになってみてください。

 

最後に、本記事で使用した用語について下記の様に記させていただきます。

【用語の出典】

本記事はアップル公式サイトで使用されている機能の名称に準拠して書かれています。インターネットで使用される様々な表現がありますが、極力 正式名称に合わせる様に致しました。本文の合間にも参考にした公式サイトURLを貼りましたが、それ以外の用語もこちらに載せます。

  • 「カラー」ウィンドウ:https://support.apple.com/kb/PH16825?locale=ja_JP&viewlocale=ja_JP
  • ピッカーインターフェース:https://support.apple.com/kb/PH16825?locale=ja_JP&viewlocale=ja_JP
  • マークアップツールバー:https://support.apple.com/ja-jp/guide/preview/prvw1501/mac
  • カラーピッカー:https://support.apple.com/kb/PH16198?locale=ja_JP&viewlocale=ja_JP
  • 枠のカラー:https://support.apple.com/ja-jp/guide/preview/prvw1501/mac
  • 塗りつぶしのカラー:https://support.apple.com/ja-jp/guide/preview/prvw1501/mac

 

以上で、本記事を結ばせていただきます。

是非 本記事の内容をご活用なさってください(´∀`)

 

最後までご覧くださりまして、誠にありがとうございました。

白ねずみ(@whitemicemoon

 

Follow me!

シェア・共有はコチラから!

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です