これ便利でいいね!WebページのUIエレメントのサイズやマージンが簡単に計れるChromeの機能拡張 -Dimensions
Post on:2014年9月16日
Win/Mac対応、Chromeで表示したWebページのUIエレメントのサイズやマージンが簡単に計れてしまう無料の機能拡張を紹介します。
Webページだけでなく、画像をChromeで表示すれば画像も計ることができます。
![サイトのキャプチャ](http://coliss.com/wp-content/uploads-201403/2014091601.png)
Dimensionsの使い方は簡単です。
Chromeにインストールすると、ツールバーにDimensionsのボタンが増えます。
![ブラウザのキャプチャ](http://coliss.com/wp-content/uploads-201403/2014091604.png)
ツールバーのアイコンにDimensionsが(使用中はカラーがブルーになります)
ChromeでWebページを表示し、Dimensionsボタンをクリックし、測定したい箇所にマウスを移動するだけです。
![サイトのキャプチャ](http://coliss.com/wp-content/uploads-201403/2014091603-01.png)
当ブログをDimensionsで測定中
何もないとこを指定すればマージンが計れ、矩形や円形などの要素を指定するとそのサイズが計れます。
DimensionsはWebページだけでなく、画像でも計ることができます。
![サイトのキャプチャ](http://coliss.com/wp-content/uploads-201403/2014091603-02.png)
Chromeで画像ファイルを表示
使用した素材:Green Eco Free UI
ダウンロードはページ中央の「Install from Chrome Webstore」ボタンをクリックし、Chromeウェブストアからどうぞ。
![サイトのキャプチャ](http://coliss.com/wp-content/uploads-201403/2014091602.png)
Dimensionsはオープンソースプロジェクトで、個人でも商用でも無料で利用できます。
sponsors