スポンサーリンク

Firefox:アドオンなしでウェブサイトの色を抽出(スポイト)する

この記事は約1分で読めます。

操作画面

こんにちは、さち です。

今回は、Firefox で
アドオンを使わずにウェブサイトの色を抽出(スポイト)する方法について
書いていきます。

スポンサーリンク

アドオンなしでウェブサイトの色を抽出(スポイト機能)

  1. メニューの「ツール」→「Web開発」→「スポイト」と進みます。
    (メニューがない場合は「Alt」キーを押して表示)
    操作画面
  2. 拡大鏡が表示されます。
    色を抽出したい部分にカーソルを合わせましょう。
    操作画面
  3. クリックすると色がコピーされます。
    操作画面
  4. ペーストで色コードを貼り付けられます。
    操作画面

色を抽出する時の形式を変更する

  1. 「Ctrl + Shift + I」で開発ツールを表示。
    「歯車」ボタンをクリックします。
    操作画面
  2. 「既定の色単位」で色の表示形式を変更できます。
    操作画面
  3. 形式は「16進数」「HSL(A)」「RGB(A)」「色の名前」の4種類。
    (「色の名前」を選んだ場合、色名がない時は「16進数」で表示)
    CSS に用いるなら「16進数」がよいと思います。
    操作画面
  4. ちなみに、「RGB(A)」だとこんな感じです。
    操作画面

開発ツールに「スポイト」ボタンを追加

  1. 開発ツールの「歯車」ボタンをクリック。
    操作画面
  2. 「ページから色を選択肢ます」にチェックを入れます。
    操作画面
  3. 開発ツールに「スポイト」ボタンが追加されました。
    クリックすると、カーソルがスポイトモードになります。
    操作画面

ウェブサイト制作に役立てて下さいね。

コメント

タイトルとURLをコピーしました