Online Ruler

Accurate 1:1 screen ruler with physical calibration, supporting CM and Inch measurements.

📏 Online Ruler: Precise 1:1 Screen Measurement & Physical Calibration Tool —— A lightweight, high-precision professional browser extension that transforms your screen into a real-world physical ruler. ----------------------------------- Do you often struggle to obtain accurate measurements when sizing objects on your screen due to varying resolutions and zoom levels? "Online Ruler" is designed specifically to solve this common frustration. Utilizing unique physical calibration technology, it dynamically renders precise 1:1 scales based on your monitor's actual PPI (Pixels Per Inch), providing you with real-world-accurate measurement references—whether you are browsing a webpage or working in a standalone window. Whether you are a designer, an engineer, or simply a user who needs to measure small objects on your screen, this extension offers you the most intuitive and reliable digital measurement solution available. 🎉 NEW IN v1.1.0: 360° ARBITRARY ROTATION ----------------------------------- Break free from the constraints of horizontal and vertical measurements. You can now rotate your ruler to any angle to match any object on your screen: ✨ Smooth Rotation Handle: Simply drag the new rotation handle at the end of the ruler (in Overlay Mode) to adjust its angle with fluid, real-time feedback. ✨ Precision Snapping: Effortlessly lock onto key angles like 45°, 90°, and 180° with built-in snapping logic and one-click presets for rapid switching. ✨ Visual Angle Badge: A dynamic tooltip displays your exact rotation degree in real-time, ensuring professional-grade measurement precision. ✨ Full Consistency: The realistic wood grain, scale markings, and interactive toolbar all maintain their structural integrity and clarity at any orientation. 🌟 Core Features ----------------------------------- ✨ Physical-Level Calibration: Calibrate the ruler by aligning it with standard physical objects—such as a credit card, a sheet of A4 paper, or a coin—to automatically calculate your screen's exact PPI. Supports +/- buttons for fine-tuning adjustments down to a single pixel. 📏 Dual Measurement Modes: Standalone Window Mode: Opens a clean, "always-on-top" ruler window that supports free resizing and switching between horizontal and vertical orientations. Page Overlay Mode: Displays a floating ruler directly over any webpage; supports transparency adjustments to ensure it does not interfere with your reading experience. 🔄 Zero Offset & Reset: Mimics the protective "zero-point" edge found on physical rulers, allowing you to set a custom starting offset (in mm). Includes a one-click "Reset to Zero" function to quickly restore the measurement baseline. 🪵 Realistic Wood Grain Aesthetics: Features a ruler body with a realistic wood grain texture generated via dynamic SVG filters, balancing a professional look with visual comfort, while ensuring the measurement markings remain crisp and sharp. 📏 Comprehensive Scale Support: Metric: Centimeter (CM) and Millimeter (MM) scales. Imperial: Inch scales, featuring high-precision subdivisions down to 1/16 of an inch. 🔄 Flexible Interaction Logic: Full-Edge Resizing: In Overlay Mode, simply drag any point along the end of the ruler to adjust its length—no need to hunt for a tiny resize handle in the bottom-right corner. Real-time Synchronization: Changes to Popup settings—such as zero-point offsets—are instantly applied to all currently open rulers. 💾 Privacy & Local Storage: All calibration data (PPI, unit preferences, offsets) is stored exclusively within your local browser; absolutely no data is uploaded to external servers. 📖 Instructions ----------------------------------- 1. First-time Use: Click the extension icon to enter "Calibration Mode." 2. Alignment Calibration: Select a physical reference object (e.g., a credit card). Place the actual object directly against your screen, then adjust the slider (or click the +/- buttons) until the red on-screen frame aligns perfectly with the physical object. 3. Start Measuring: Click "Open in New Window" or "Add Ruler to Current Page" to begin using the tool. 4. Adjusting the Zero Point: If the starting edge of the object you wish to measure is obstructed, simply adjust the "Zero-point Offset" slider within the Popup menu. 🎨 Design Philosophy ----------------------------------- Precision Above All: Built upon the rigorous mathematical formula `pixelsPerMm = ppi / 25.4`, ensuring a true 1:1 scale reproduction. Visual Consistency: Whether oriented horizontally or vertically, the wood grain texture—generated via SVG filters—always aligns perfectly with the direction in which the ruler extends. Instant Usability: Full-edge drag handles and a prominent "0" mark minimize interaction friction, making the tool intuitive and effortless to use. 🗺️ Roadmap ----------------------------------- Auxiliary Reference Lines: Adding optional crosshairs or snap-to-edge functionality to facilitate height comparisons. Multiple Rulers: Enabling the simultaneous use of multiple rulers on a single page for multi-dimensional measurements. Expanded Calibration References: Adding support for more reference standards, such as A5 paper and common mobile phone screen dimensions. 💬 Feedback & Suggestions ----------------------------------- Crafted specifically for users who demand uncompromising precision! If you have any great ideas or encounter any issues, please don't hesitate to contact us. Your feedback is the driving force behind our continuous improvement. Precise measurement—right at your fingertips! 🚀