• 旅行
    2012/10/18 世界遺産 屋久島の旅 - day4 縄文杉
    2012年11月13日
  • インドネシア
    【バリ】デンパサール空港から徒歩で近隣ホテルまで歩いてみた! 道筋や所要時間や安全性、疲労度などまとめ
    2018年4月10日
  • Excel
    【Excel】同じファイルの別々のシートを並べて表示する方法
    2014年5月2日
  • 鹿児島
    実は100%水力発電の島! 自然エネルギーのみで成り立つ知られざる屋久島のスゴみ
    2015年12月19日
  • Windows
    黒画面に白カーソルが点滅してWindowsが起動しない問題を解決してみた(Boot順の変更)
    2015年10月14日
  • Excel
    【Excel】土・日曜日の日付セルを自動的に色塗りする方法(動画あり)
    2014年10月11日
  • Excel
    【Excel】シートの見出しに色を付けて見分けやすくする方法
    2013年5月7日
  • Office
    Office 365 SoloをMacにインストールしてみた
    2015年1月18日
  • Chrome
    MacのChromeで隣のタブへ移動するショートカットキー(Yosemite版)
    2015年1月19日
  • Windows
    【Windows10】通知サウンドを鳴らさないようにする方法
    2015年8月8日
  • Excel
    【Excel】「20150325」という数字の羅列を日付フォーマットに直す方法
    2015年4月11日
  • Excel
    【Excel】フィルターで表示中のデータだけで合計する方法
    2017年9月25日
  • 旅行
    『世界一美しい散歩道』と呼ばれるミルフォードトラック IN ニュージーランドに行ってきました!
    2013年11月25日
  • Excel
    【Excel】ファイルを開くたびに「保護されたビュー」のメッセージが表示されるのをやめさせる
    2014年5月22日
  • アイテム
    GoProでSDカード内の動画を削除したのに領域が空にならない場合の原因と対処法
    2016年12月24日
  • Windows
    Microsoftが公式で配布しているWindowsのISOファイル/仮想マシンのリンクまとめ(2015年10月版)
    2015年10月24日
  • Webサイト
    9の質問に答えていくと相性の良い国を教えてくれるサイトを試してみたら…見事に納得の結果だった件
    2014年8月17日
  • 鹿児島
    なんと1kgで1000円! 養殖カキを焼きまくれる&食べまくれる福岡・糸島の「岐志漁港」がアツい
    2015年12月20日
  • コマンド
    【バッチ勉強】現在の日付と時刻をファイル名に指定する方法
    2014年10月18日
  • コマンド
    文字がカナ入力になってしまった時に元に戻す方法(ショートカットキー)
    2012年5月13日
  • ニュージーランド
    【NZ】北島・南島を結ぶカーフェリーの個人予約から実際に乗り込むまでの方法まとめ(動画あり)
    2017年2月11日
  • ニュージーランド
    【NZ】車1台で旅するニュージーランドノマドの1日はこんな感じ
    2017年3月7日
  • Windows
    ファイルパスをコピーして、ファイルを開く最短ショートカットキー
    2013年7月30日
  • ニュージーランド
    【NZ】ニュージーランド・ノマドツアー その6 Great Walks「ヒーフィートラック」を歩く
    2017年3月11日
  • Excel
    【Excel】シートを0.5秒でコピー(複製)する超速時短技
    2015年9月11日
  • 鹿児島
    屋久島・ヤクスギランドは登山初心者・経験者もみんな楽しめる素晴らしいハイキングルートでした
    2015年12月2日
  • その他
    ちょっとしたExcelの利用なら無料の「Office Online」でもう必要十分すぎる件
    2015年3月30日
  • 鹿児島
    7月から設置された羽田空港・ANAの新兵器「バゲッジドロップ」を使ってみた
    2015年11月10日
  • iPhone
    プリズムフィルターで写真を独創的にアレンジできるアプリ「Fragment」
    2014年11月20日
  • ニュージーランド
    【NZ】Great Walksを自分で予約する方法まとめ
    2017年3月3日

2012-0804-102027.jpg

引き続き、Webデザイン上で役立ちそうなChromeアドオンをご紹介します。
表示される色を表すカラーコードというものがHTMLやCCSにはありますが、
Web上の閲覧中のサイトから、そのカラーコードを抽出することが出来る
Chromeアドオン、「Eye Dropper」を紹介します。

スポンサードリンク

関連記事


Eye Dropper
https://chrome.google.com/webstore/detail/hmdcmlfkchdmnmnmheododdhjedfccka

先ずはアドオンをインストールします。
すると、このようなアイコンが追加されます。
2012-0804-133927.jpg

「Pick from web」タブから、「Pick color from webpage」を選択すると、
マウスのすぐ近くに「小さい□」マークが表示されます。
2012-0804-134032.jpg

2012-0804-134152.jpg

マウスを任意の部分にあわせると、
このように□の部分に色が表示されるので、
抽出したい色が表示されている場所でクリックを押します。
2012-0804-134200.jpg

すると、アドオン側の画面にその選択の色が表示され、
表示されている色の□にマウスをおくとカラーコードが表示されます。
この画像だと「#f6be21」の部分がカラーコードにあたります。
2012-0804-134640.jpg

操作方法としては以上です。
「Color Picker」タブを押すと、ページ側からでなく色のグラフからでもカラーコードの抽出が可能です。
2012-0804-134329.jpg