これ便利でいいね!WebページのUIエレメントのサイズやマージンが簡単に計れるChromeの機能拡張 -Dimensions

Win/Mac対応、Chromeで表示したWebページのUIエレメントのサイズやマージンが簡単に計れてしまう無料の機能拡張を紹介します。

Webページだけでなく、画像をChromeで表示すれば画像も計ることができます。

サイトのキャプチャ

Dimensions
Dimensions -GitHub

Dimensionsの使い方は簡単です。
Chromeにインストールすると、ツールバーにDimensionsのボタンが増えます。

ブラウザのキャプチャ

ツールバーのアイコンにDimensionsが(使用中はカラーがブルーになります)

ChromeでWebページを表示し、Dimensionsボタンをクリックし、測定したい箇所にマウスを移動するだけです。

サイトのキャプチャ

当ブログをDimensionsで測定中

何もないとこを指定すればマージンが計れ、矩形や円形などの要素を指定するとそのサイズが計れます。

DimensionsはWebページだけでなく、画像でも計ることができます。

サイトのキャプチャ

Chromeで画像ファイルを表示
使用した素材:Green Eco Free UI

ダウンロードはページ中央の「Install from Chrome Webstore」ボタンをクリックし、Chromeウェブストアからどうぞ。

サイトのキャプチャ

Dimensions

Dimensionsはオープンソースプロジェクトで、個人でも商用でも無料で利用できます。

top of page

©2017 coliss