webサービス

Web上の色(カラーコード)を知りたい時に使えるChrome拡張機能「Eye Dropper」

先日書いたスマホでのソーシャルボタン自作の際、各サービスのカラーコードが知りたくなりました。

各サービス名+カラーコードと検索してもすぐには出てきませんでした。

これを解決するための、カラーコードを知るためのGoogle Chrome拡張機能「Eye Dropper」がありました。

簡単に使えるので便利です。

カラーコードを知る事が出来る「Eye Dropper」の使い方を紹介します。
eyedropper

スポンサーリンク
スポンサーリンク

Eye Dropperの使い方

Chrome ウェブストア – Eye DropperからEye Dropperを入手する事が出来ます。

eyedropper
▲インストールすると、右上に拡張機能が表示されているかと思います。これを選択し、

eyedropper
▲「Pick color from web page」を選択します。これでwebページから色を取得できるようになります。

eyedropper
▲欲しい色がある場所でクリックします。

eyedropper
▲再びEye Dropperを見てみると、カラーコードが右側に表示されています。また、左下には取得した色の履歴が表示されています。再び使いたくなった色はこちらから選択すればいいですね。

まとめ

各サービスの配色は一般的な色であることが少ないです。

そのような時は、自分で永遠と探すのではなく、Chrome拡張機能の「Eye Dropper」を使った方が速いです。

いやはや便利だ。

最後に、今回ボタンを作成する上で必要となったサービスのカラーコードを示して閉めたいと思います。

  • Twitter・・・#55acee
  • Facebook・・・#3d5b99
  • LINE・・・#00c400
  • はてなブックマーク・・・#2c6ebd

今回紹介したChrome拡張機能「Eye Dropper」リンク
Chrome ウェブストア – Eye Dropper

スポンサーリンク
スポンサーリンク

関連記事

  1. webサービス

    Amazonインスタント・ビデオの視聴の種類、レンタルルール、画質、値段について

    先日、Amazonインスタント・ビデオで映画をレンタルしてみた(iPh…

  2. webサービス

    Twitterの検索結果をRSSとして取得する方法

    追記 2018年3月8日 現在、Rsstwiへは…

  3. webサービス

    アクセス解析のChartbeatはリアルタイムの解析に特化している!

    今までブログのアクセス解析にはGoogle Analyticsを利用し…

  4. webサービス

    Amazon Student会員限定の大学対抗キャンペーン上位5大学が発表!

    当ブログでも記事にしていました、Amazon Student会員限定の…

  5. webサービス

    Chrome拡張機能のEvernote Web Clipperを使えば見ているページを簡単&…

    ウェブサーフィンしている時に、このページ後でもう一回見たい!と思う事が…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

カテゴリー

  1. Microsoft-OneDrive

    webサービス

    Onedriveの容量を15GB→30GBに増やす方法(2014年9月30日まで…
  2. goodreader

    iPhoneアプリ

    iPhoneで簡単にYoutubeをGoodReaderに保存する方法
  3. gl06p

    モバイルWi-Fiルーター

    GL06PのSSIDの名称を変更する方法
  4. Mac設定

    【Mac】スクリーンショットの保存先を変更する方法
  5. iPhoneアプリ

    2012年に定番となったiPhoneアプリ8個を紹介
PAGE TOP