Screen Ruler

Calibrate and measure on-screen pixels with a virtual ruler. Useful for designers and developers. 100% free, private, and browser-based — no sign-up.

Related free tools

Text Shadow Generator — Design CSS text shadows with a visual editor and live preview.
Placeholder Image Generator — Generate placeholder images with custom size, color, and text.
Color Palette Generator — Generate harmonious color palettes from any base color.
Color Contrast Checker — Check WCAG 2.1 contrast ratio with AA / AAA pass marks for normal text, large text, and UI components.
CSS Clamp Generator — Build fluid clamp() expressions for responsive typography and spacing — no media queries needed.
Pixel to REM Converter — Live two-way px ↔ rem conversion with custom root font-size. Built for accessible, user-respecting design.
Color Blindness Simulator — Preview images and UI through protanopia, deuteranopia, tritanopia, and achromatopsia simulations.
CSS Unit Converter — Convert any CSS length unit to all others with customizable base font-size and viewport dimensions.
CSS Triangle Generator — Generate pure-CSS triangles for tooltips, arrows, and speech bubbles. 8 directions, any size or color.
CSS Cubic Bezier Generator — Design custom easing curves visually with live curve and animation preview. Production-ready CSS.
CSS Glassmorphism Generator — Design frosted-glass UI panels with backdrop blur, opacity, saturation, and tint. Live preview.
CMYK Color Converter — Convert HEX and RGB to CMYK percentages for print. Two-way conversion with live preview.