画面上の任意の色から16進コードを見つける方法

あなたのデジタルデバイスには、何百万もの目を引くカラーがあります。その中の特定の色が好きですか?デザインやアプリのテーマに使用したいですか?まず、ピクセルから16進コード(またはカラーコード)を判断できるカラーピッカーユーティリティを使用する必要があります。

画面上の任意の色から16進コードをコピーできる(ピクセルレベルまで)無料のスポイトツールが数多くあり、わずか数クリックでインストールできます。

1. Instant Eyedropper(Windows)

Instant Eyedropperは、画面上の色の正確な16進値を特定するアプリです。マウスポインタの真下のピクセルの16進カラーコードが表示されます。マウスボタンを離すと、ほら!その色の16進コードがクリップボードに保存され、好きな場所に貼り付けることができます。

16進コードを別の形式で表示したいですか?Instant Eyedropperの右クリックメニューからオプションに移動して、希望の形式を指定します。

ダウンロード:Windows用Instant Eyedropper(無料)

2. System Color Picker(Mac)

System Color Pickerは、Macの画面から16進カラーコードを見つけるための完全に無料のアプリです。デフォルトでは、他のアプリと同様に起動する必要がありますが、macOSのメニューバーに追加して簡単にアクセスし、次の手順に従って16進カラーコードを取得できます。

  1. アプリを起動して、メニューバーからカラーピッカー>設定に移動します。
  2. 一般タブで、Dockではなくメニューバーに表示を切り替えます。
  3. 次に、カラーピッカーのメニューバーアイコン(水滴で示される)をクリックして色を選択を選択します。
  4. 拡大鏡を使用して、16進コードを取得するピクセルに移動します。
  5. 16進コードを見つけるには、メニューバーアイコンをもう一度クリックすると、最近選択したカラーの下に表示されます。

このツールをメニューバーに表示したくない場合は、アプリを起動して、代わりにカラーピッカーのウィンドウからスポイトツールをクリックするだけです。

ダウンロード:Mac用System Color Picker(無料)

3. Digital Color Meter(Mac)

Macにもカラーピッカーが内蔵されていることをご存知ですか?Digital Color Meterと呼ばれ、16進コードを見つけるために使用できるもう1つのアプリケーションです。Digital Color Meterはアプリケーション>ユーティリティにあります。もちろん、MacのSpotlight検索を使用してすばやく起動することもできます。

デフォルトでは、Digital Color Meterは16進コードではなく、色のRGB値を表示します。これを変更するには、アプリを起動して、メニューバーから表示>値の表示>16進数としてをクリックします。

これで、アプリがアクティブなときにカーソルを動かし、Command + Shift + Cをクリックするだけで、カーソルの下のピクセルの16進コードをクリップボードにコピーできます。その後、好きな場所に貼り付けることができます。これは、画面上の要素から16進カラーコードをすぐに取得する必要がある人にとっては便利なツールです。

4. ColorZilla(ChromeとFirefox)

ColorZillaは、画面上の要素から16進カラーコードを取得するために使用されるもう1つの一般的な拡張機能です。インストール後、ブラウザのツールバーにあるアイコンをクリックして、スポイトやその他の機能にアクセスします。

カーソルを任意のピクセルの上に置くと、16進コードとRGB値の両方が表示されます。ピクセルをクリックすると、その16進コードがクリップボードにコピーされます。拡張機能の設定では、自動コピー機能で使用する別のカラー形式を選択することもできます。

ダウンロード:Chrome用ColorZilla | Firefox(無料)

5. マークアップツール(iPhoneとiPad)

iOSでは画面上の任意の色から16進値を選択できませんが、内蔵のマークアップツールを使用すると、画像から16進コードとRGB値を取得できます。そのため、画面上のものをすばやくスクリーンショットで撮影し、マークアップから16進コードを取得できます。アクセス方法は次のとおりです。

  1. iPhoneまたはiPadでスクリーンショットを撮影し、画面の左下隅に表示されるスクリーンショットプレビューをタップして、マークアップを使用します。
  2. 次に、下部にあるルーラーの横にあるカラーピッカーをタップします。
  3. 次に、カラーメニューのスライダータブに移動して、スポイトアイコンをタップします。
  4. 拡大鏡をカラーコードを取得するピクセルにドラッグすると、同じメニューにその色の正確な16進コードが表示されます。

もちろん、これは回避策のように思えます。しかし、少なくともサードパーティのカラーピッカーアプリに頼る必要はありませんよね?

6. カラーピッカー(Android)

最後に、Androidユーザー向けの同様のソリューションを紹介しますが、タスクを完了するにはサードパーティのアプリに頼る必要があります。ただし、このアプリの特別な点は、カメラを何かに向けてそこから16進コードを取得できることです。

Androidデバイスで16進カラーを識別するには、次の簡単な手順に従います。

  1. PlayストアからMikhail Gribanovのカラーピッカーをインストールしたら、スクリーンショットを撮影してからこのアプリを起動します。
  2. 次に、画像を開くをタップして、ギャラリーから先ほど撮影したスクリーンショットを選択します。
  3. これで、画像をパンしてズームインし、識別したい色が画面中央の円に収まるまで拡大します。

これで完了です。これで、どのデバイスを使用しているかに関係なく、画面に表示されている任意の色の16進コードを見つける方法がわかりました。

ダウンロード:Android用カラーピッカー(無料)

どのデバイスでも簡単に16進カラーコードを取得

カラーピッカーのような小さなユーティリティはそれほど重要ではないように思えるかもしれませんが、デザイナーと非デザイナーの両方にとって便利です。たとえば、Discordユーザーは名前やサーバーの役割などの色を変更するために定期的に16進コードをいじっています。

複数のデバイスを切り替えるにつれて、複数のツールを使用していることに気づくでしょう。そのため、所有しているデバイスに応じてそれらを確認し、自分に合ったものを見つけてください。