PixelTape — Measure & Pick Colors

Measure distances, pick colors, and outline elements on any webpage. Built for frontend devs & QA testers.

PixelTape is a lightweight developer tool that gives you three essential inspection utilities directly in your browser — no DevTools required. ──────────────────────────────────────── WHAT IT DOES ──────────────────────────────────────── 📐 RULER Click two points on any webpage to instantly measure the pixel distance between them. A live "w × h" tooltip follows your cursor as you drag. The result is copied to your clipboard on the second click. The ruler stays active so you can take multiple measurements in a row — press ESC when you're done. 🎨 COLOR PICKER Pick any color on screen using Chrome's native EyeDropper API. Supports HEX, RGB, HSL, and RGBA output. The value is copied to your clipboard automatically in your preferred format. Every picked color is saved to a history panel — click any swatch to copy it again. 🔲 OUTLINE One click draws a 1 px outline around every element on the page. Each HTML tag type gets a distinct color so you can immediately see nesting, spacing issues, and layout bugs without touching the DevTools element tree. Click again to remove all outlines. ──────────────────────────────────────── PRIVACY ──────────────────────────────────────── PixelTape collects zero data. There are no analytics, no tracking pixels, and no external network requests. Your color history and preferences are stored locally in chrome.storage.local and never leave your device. ──────────────────────────────────────── PERMISSIONS — WHY EACH ONE IS NEEDED ──────────────────────────────────────── • Access to all websites — The ruler, color picker, and outline tools work by injecting a lightweight overlay into the active page. This requires host access so the tools function on every site you visit, regardless of domain. • Read and change data on websites (scripting + activeTab) — Used exclusively to inject the overlay when you activate a tool. Nothing is injected passively; injection only happens when you click a button. • Clipboard — Required to copy measurement results and color values to your clipboard automatically after each action. • Storage — Used to remember your color history and preferred copy format (HEX / RGB / HSL / RGBA) between sessions. No data leaves your browser. ──────────────────────────────────────── WHO IS IT FOR? ──────────────────────────────────────── Frontend developers, UI/UX designers, and QA testers who need fast, accurate measurements and color values without leaving the browser or taking screenshots.