オンライン定規
画面上で現実世界の寸法を測定
オンライン定規を使って、画面上の長さをセンチメートル、ミリメートル、またはインチ単位で測定できます。既知の寸法の基準物を使って校正を行うことで、正確な1:1の測定が可能です。
画面上の物体のサイズや角度を推測するのはもうやめましょう!オンライン定規は、画面を現実世界の測定リファレンスに変えるために設計されたプロフェッショナルなツールです。
🎉 v2.2.0 アップデート:Web定規のキーボード操作とピクセル単位の微調整に対応。
画面上で現実世界の寸法を測定
オンライン定規を使って、画面上の長さをセンチメートル、ミリメートル、またはインチ単位で測定できます。既知の寸法の基準物を使って校正を行うことで、正確な1:1の測定が可能です。
バーチャル分度器で角度を測定
画像、図表、またはデザイン案上の角度に、オンライン分度器を重ね合わせます。分度器の中心を角の頂点に合わせるだけで、目盛りから角度を読み取ることができます。拡張機能のインストールは一切不要です。
2本の調整可能なアームを使って角度を測定
頂点の位置を決め、2本のアームをドラッグして、測定したい角の辺に合わせます。ツールが自動的にその間の角度を計算するため、画像や図表、デザイン案に含まれる様々な不規則な角度を簡単に測定できます。
クレジットカード、A4用紙、あるいは硬貨などの身近な実物を使用して、画面の正確なPPIを自動的に算出します。+/- ボタンによる1ピクセル単位の微調整にも対応。
画面定規:メートル法とヤード・ポンド法の両方に対応し、長さ、間隔、要素サイズを測定。
標準分度器:PPI校正データに基づく実寸サイズでレンダリングされる、360度回転可能な半透明分度器。
三点式動的分度器:頂点と2つの端点で任意の角度を測定。リアルタイム角度表示、アーム延長、扇形ビジュアライズに対応。
精密な位置調整:Web定規を選択した状態で、矢印キーを使って1ピクセル単位の微調整が可能です。また、Shiftキーを押しながら矢印キーを使用すると10ピクセル単位で移動でき、マウスドラッグ時の手ブレやズレを防ぐことができます。
複数の定規の切り替え:複数の定規が配置されている場合、定規にフォーカスを当てた状態でTabキー(またはShift + Tabキー)を押すと、操作対象の定規を順次切り替えることができます。
同一ページ内に複数の定規、標準分度器、三点式分度器を追加でき、複雑な比較測定や幾何学的なポジショニングのニーズに応えます。
独立ウィンドウモード:画面の最前面に常に表示される、すっきりとした定規ウィンドウを開きます。
ページオーバーレイモード:ウェブページ上に定規や分度器を直接重ねて表示。透過率の調整も可能です。
回転ハンドルを使用して定規や標準分度器の角度をリアルタイム調整。45°/90°などの主要な角度へのスナップ機能に対応。
三点式分度器のアームも45度ごとのスナップに対応しています。
実物の定規にある「ゼロ点」の端を再現し、任意の開始位置(mm)を設定可能。ワンクリックで基準点をリセットできます。
定規は木目調、プラスチック、金属の各テクスチャ(動的SVGフィルター)をサポート。
分度器は複数の半透明カラースキーム(クラシックブルー、テックグリーン、バイタルオレンジ等)により、背景を選ばず見やすく表示されます。
三点式分度器は扇形部分の透過率を個別に設定可能です。
メートル法:センチメートル(CM)およびミリメートル(MM)。
ヤード・ポンド法:インチ単位。1/16インチ単位までの高精度な分割表示。
エッジ全体でのサイズ調整:定規の端であればどこをドラッグしても長さを調整できます。
精精密な連携:マウスドラッグとキーボードの矢印キーによる、ピクセル単位の微調整がシームレスに連携します。
リアルタイム同期:Popupでの設定、材質、カラーの変更は即座に反映されます。
すべてのキャリブレーションデータ(PPI、単位設定、オフセット等)は、ブラウザのローカル環境内にのみ保存されます。
拡張機能アイコンをクリックし、「校正モード」に入ります。
参考物(例:クレジットカード)を選択し、赤い枠が実物と一致するように調整します。
「定規を追加」または「分度器を追加」をクリックして測定を開始します。
ツールバーのアイコンをクリックして、素材や色の切り替え、透明度の調整が可能です。
本体をドラッグして移動し、端にある回転ハンドルをドラッグして角度を調整します。
ブラウザ右上のパズルアイコン 🧩 をクリックし、「オンライン定規」を見つけて、その横にあるピンアイコンをクリックしてツールバーに固定します。その後、アイコンをクリックするだけでいつでも定規を開くことができます。
はい。モニターごとに解像度が異なるため、通常の画像は不正確です。この拡張機能は「物理校正」技術を使用しており、クレジットカードやA4用紙で一度合わせるだけで、画面の実際のサイズを記憶し、1:1の正確な測定を実現します。
はい。システムはA4用紙や硬貨など、複数の基準物に対応しています。将来的には、A5用紙や一般的なスマホの画面サイズなどの基準も追加する予定です。
「独立ウィンドウ」は、画面上のどこにでも配置でき、他のソフトの上に重ねて表示できるクリーンでサイズ調整可能な定規ウィンドウを表示します。「ページ注入」は、閲覧中のウェブページに定規を直接「貼り付け」ます。透明度調整が可能で、コンテンツの邪魔になりません。
はい!v2.0.0より、複数の定規と分度器を同時に使用できるようになりました。「定規を追加」または「分度器を追加」を複数回クリックすることで、各ツールを独立して移動、回転、サイズ調整、素材・色の設定ができ、比較測定や幾何学的な配置に最適です。
定規の端にあるツールバーまたはポップアップメニューで素材の切り替えが可能です。現在、木製、プラスチック、金属に対応しています。「プラスチック」を選択すると、配色をカスタマイズしてウェブ背景に合わせることができます。
「ゼロ点オフセット」機能を使用してください。本物の定規の保護端をシミュレートし、開始位置に空白(ミリ単位)を設定できます。ワンクリックで「ゼロ」に戻すことも可能です。
とても簡単です。ページ注入モードでは、隅にある小さなツマミを探す必要はなく、定規の端の「どこでも」ドラッグするだけで自由に長さを調整できます。
はい!定規の端にある回転ハンドルをドラッグするだけです。また、45°、90°、180°への精密スナップにも対応しており、素早い調整が可能です。
はい!v2.0.0で「分度器」機能を追加しました。「分度器を追加」をクリックするだけで、1:1の正確な分度器を挿入できます。360°回転、複数の配色、物理校正に基づくPPI同期に対応しています。
万能分度器は、PPIに基づく同期校正だけでなく、360°の自由回転や、さまざまなウェブページの背景で使用しやすい複数の半透明カラースキーム(クラシックブルー、テックグリーンなど)をサポートしています。
スリーポイントダイナミック分度器は、1つの頂点と2つの端点を使って角度を測定します。標準的な分度器とは異なり、固定スケールに合わせる必要はありません。代わりに、3つのコントロールポイントを直接ドラッグして、ウェブページ上の要素に合わせることができます。非標準的な角度、デザインモックアップの端、画像内の幾何学的角度の測定に特に適しています。」
はい。2つの端点を直接ドラッグすると、測定アームは無限に伸びます。そのため、広いスパンを持つウェブページ要素、長い対角線、複雑な幾何学的形状の測定に最適です。」
はい。三点分度器では、中央セクター領域の透明度を個別に調整できます。これにより、セクターが下のウェブページのテキストや詳細情報の視界を遮ることなく、現在の測定範囲を明確に視覚化できます。」
いいえ。校正データ(PPIなど)、単位設定、オフセット量はリアルタイムで同期・保存されます。ポップアップメニューでの変更も、ページの切り替えも、設定は即座に反映されます。
はい。本拡張機能はメートル法(CM、MM)とヤード・ポンド法(インチ Inch)の両方に対応しており、インチ表示は1/16インチ刻みの高精度な測定が可能です。
いいえ。すべての校正データと設定はブラウザのローカル環境に保存されます。サーバーにデータをアップロードすることは一切ありません。
すべての素材(木製、プラスチック、金属)はSVG技術を使用して動的に生成されたリアルな視覚効果です。非常に軽量で、ブラウザの動作速度に影響を与えることはありません。
🎉 v2.2.0 アップデート:Web定規のキーボード操作とピクセル単位の微調整に対応
今回のアップデートでは、Web定規の操作精度と利便性を大幅に強化しました。キーボードによる完全な操作に対応し、ピクセル単位の正確な配置や、複数の定規を効率よく切り替えて使用できるようになりました。
✨ キーボードによるピクセル単位の微調整:定規にフォーカスがある状態で、キーボードの矢印キー(↑ / ↓ / ← / →)を使うと、1ピクセル単位で正確に位置を微調整できます。また、Shiftキーを押しながら矢印キーを使えば10ピクセル単位で移動できるため、精密な計測と素早い位置決めの両方が可能です。
✨ クリックで素早くフォーカス:Webページ上の定規をクリックするだけで、その定規にフォーカスが当たります。操作ガイドも表示されるため、すぐにキーボード操作を開始できます。
✨ Tabキーで複数の定規をスムーズに切り替え:ページ上に複数の定規を配置している場合、フォーカスがある状態でTabキー(またはShift + Tabキー)を押すと、対象の定規をスムーズに切り替えられます。複数の定規を使った比較計測がより効率的になります。
✨ 親切なキーボード操作ガイド:キーボード操作のヒント(矢印キーで1ピクセル移動、Shift + 矢印キーで10ピクセル移動)や操作説明のツールチップが表示されるため、ショートカットキーを暗記していなくても、すぐに使いこなせます。
🎉 v2.1.0 アップデート:三点式動的分度器が登場!
今回のアップデートでは、実際の整列シーンに最適な三点式動的分度器を追加し、角度測定機能をさらに強化しました:
✨ 三点式動的分度器:頂点と2つの端点で構成されるツールを追加し、3つのポイントで任意の角度に素早く整列できます。
✨ リアルタイム角度計算:端点をドラッグすると、2本の腕の間の角度を度(°)単位で自動計算して表示します。
✨ 動的延長アーム:2本の測定アームは端点のドラッグに合わせて延長可能で、大きな要素やデザインの斜線にも対応します。
✨ 半透明の扇形領域:現在の測定範囲を直感的に把握できる半透明の扇形を表示。不透明度の個別調整も可能です。
✨ 独立アームのスナップ:各アームが45°刻み(0°、45°、90°など)に自動吸着し、一般的な方向への素早い整列をサポートします。
✨ 高精度な位置合わせ:マルチカラーに対応し、頂点には透明な中空円を採用。中心点が明確なため精密な位置合わせが可能です。
🎉 v2.0.0 メジャーアップデート:多機能幾何学分度器が登場!
今回のアップデートにより、単なる測定ツールから包括的な幾何学ツールボックスへと進化しました:
✨ 新機能 分度器:定規に加えて、任意のウェブページに分度器を追加できるようになりました。
✨ 360° 自由回転:ハンドルによる360°回転に対応し、傾斜や角度を精密に測定できます。
✨ 多彩なカラースタイル:複数の半透明カラー(クラシックブルー、テックグリーン、ビブラントオレンジなど)を提供し、あらゆる背景で高い視認性を確保します。
✨ 物理校正の同期:分度器もPPI校正データに基づいてレンダリングされ、正確な物理サイズを保証します。
🎉 v1.2.0 新機能:マルチ定規対応と豊富な素材
今回のアップデートでは、より強力な多次元測定機能とパーソナライズされた視覚的な選択肢が追加されました:
✨ マルチ定規対応:同一ページに複数の定規を追加でき、複雑な比較測定のニーズに対応します。
✨ プラスチックと金属素材の追加:
- プラスチック素材:鮮やかな複数のカラーバリエーションを提供し、インターフェースをより活発にします。
- 金属素材:リアルなヘアライン加工の質感で、プロフェッショナルかつテクノロジー感あふれるデザインです。
✨ 素材カラーのカスタマイズ:プラスチック素材は複数の配色切り替えに対応し、ウェブ背景や個人の好みに合わせて調整可能です。
新機能:360° 自由回転
横・縦のみの測定制限を解消。画面上のあらゆるオブジェクトに合わせて、定規を自由な角度に回転できるようになりました:
✨ スムーズな回転ハンドル:定規の端(ページオーバーレイモード)にある新しい回転ハンドルをドラッグするだけで、リアルタイムかつ滑らかに角度を調整できます。
✨ 精密スナップ機能:45°、90°、180°などの主要な角度にピタッと吸附するスナップロジックを搭載。ワンクリックのプリセットボタンで素早い切り替えも可能です。
✨ 角度表示バッジ:現在の正確な回転角度をリアルタイムで表示し、プロフェッショナルな測定精度を保証します。
✨ 完璧な視覚的整合性:どの角度に回転しても、リアルな木目テクスチャ、目盛り、インターフェースの明瞭さが維持されます。
初期リリース。