画面定規：画面上のピクセル数・サイズ・角度を計測
画面定規は、ブラウザ上でデスクトップ画面やアプリウィンドウのピクセルサイズ（幅・高さ）、2点間の距離、角度を計測できるツールです。画面共有機能を使って計測対象のフレームを静止画化するため、スクリーンショットを撮影して画像編集ソフトに貼り付ける手間が不要です。すべての処理はお使いのブラウザ上で完結し、画像データが外部サーバーに送信されることはありません。
画面定規の使い方と計測の手順
画面上の任意の要素を計測する手順は以下の通りです。
- 画面共有の選択ボタンを押し、計測したいデスクトップ全体、アプリウィンドウ、またはブラウザタブを選択します。
- 選択した画面のフレームが静止画像としてキャプチャされ、共有処理は即座に停止します。
- 静止フレーム上をドラッグすると、カーソル位置に合わせて幅・高さ・距離・角度のピクセル値がリアルタイムで表示されます。
- 新しい範囲を測定したい場合は、いつでも再取得ボタンを押してフレームを更新できます。
ラインモードとボックスモードでピクセルを測る
フローティングツールバーで2つの計測モードを切り替えることができます。
ラインモードは、画面上の2点間に直線を引き、その距離と角度（水平からの傾き）を計測するモードです。要素同士の間隔や、デザインの余白、境界線の傾きを確認するのに最適です。
ボックスモードは、ドラッグした矩形選択枠の正確な幅（Width）と高さ（Height）を取得するモードです。ボタンやバナー、画像などの縦横サイズを一瞬で調べられます。また、カラー切替ボタンでガイド線の色をネオングリーンとマゼンタに変更できるため、どんな背景画像でも視認性を保てます。
ブラウザの拡大率やRetina表示でもピクセルがズレない理由
本ツールによる計測値は、キャプチャされた静止フレームの固有ピクセル解像度（Intrinsic Pixel Resolution）に基づいて計算されます。
表示画面上のプレビューサイズではなく実際のピクセルデータを参照するため、ブラウザのズーム倍率変更や、MacのRetinaディスプレイなど高DPI（デバイスピクセル比）環境であっても、計測結果が影響を受けることはありません。
インストール不要でWindowsやMacのChrome・Edgeに対応
デスクトップアプリやブラウザ拡張機能をインストールする必要はありません。Windows、Mac、LinuxなどのPC向け主要ブラウザ（Chrome、Edge、Firefox）でそのまま動作します。
なお、画面キャプチャAPIの制約により、iOS SafariやAndroid Chromeなどのスマートフォン・モバイル環境には対応していません。PCのデスクトップ環境でご活用ください。
スクリーン定規フリーソフトや貼り付け作業との違い
従来は、スクリーンショットを撮影してペイントなどの画像ソフトに貼り付け、ステータスバーでサイズを確認するか、専用のデスクトップアプリを導入する必要がありました。
本ツールなら、ブラウザの1タブ内で一瞬にして画面を静止画化し、その場でピクセル計測を完了できます。また、フレーム取得と同時に画面共有ストリームは自動停止するため、画面共有の通知インジケーターが残り続けることもありません。
よくある質問
PC画面上のボタンや画像のピクセル数はどうやって測ればいいですか？
画面選択ボタンを押して計測したいウィンドウやタブを選ぶと、画面が静止画として取り込まれます。ボックスモードで対象のボタンや画像をドラッグして囲むと、カーソル横に正確な幅と高さがピクセル単位で表示されます。
画面上の2点間の距離をピクセル単位で測る方法はありますか？
ラインモードに切り替え、始点から終点までドラッグして直線を引きと、表示されるDistance（距離）の値が2点間の直線ピクセル距離を示します。
画面内の要素やデザインの傾き（角度）を調べることはできますか？
ラインモードで計測したい輪郭や線に沿ってドラッグしてください。水平方向を0度とした場合の角度（Angle）が度数で表示されるため、デザインの傾きを確認できます。
MacやWindowsで、ソフトや拡張機能をインストールせずにピクセルを測れますか？
はい。ChromeやEdgeなどの標準的なデスクトップブラウザがあれば、拡張機能や専用ソフトを一切インストールせずにブラウザタブ内で完結して計測できます。
スマホやiPhoneの画面上でもピクセルサイズを計測できますか？
いいえ。モバイル版のiOS SafariやAndroid Chromeは画面キャプチャ機能に対応していないため、スマホ端末上では動作しません。パソコンのブラウザでご利用ください。
ブラウザのズーム（拡大率）やRetinaディスプレイで計測値がズレることはありませんか？
ズレることはありません。プレビューの表示倍率ではなく、取り込んだ画像の元解像度のピクセルデータを直接読み取って計算しているため、拡大率や高DPI設定に関わらず正確な数値が得られます。
画面共有を使う際、画像データや個人情報が外部サーバーに送信されませんか？
外部に送信されることは一切ありません。キャプチャ画像の取得およびピクセル数の計算処理はすべてお使いのデバイス（ブラウザ内部）でのみ実行されます。
保存してあるスクリーンショット画像のピクセル数も測れますか？
測定可能です。保存した画像ファイルをブラウザの別タブや画像ビューアで開き、そのウィンドウを選択してキャプチャすることで、画像内のピクセル数や距離を計測できます。
