Pathy

DevTools sidebar with full CSS path, XPath, and optimized selector for the currently selected element.

Pathy — Fast selectors for DevTools. Get the Full CSS Path, Full CSS Path (from nearest ID), Firefox-Style Path (Copy Path), Optimized Selector, XPath, and Playwright Locator for the selected element — with one-click copy. 👉 Full description Pathy adds a compact sidebar to Chrome DevTools that instantly shows multiple selector formats for the currently selected node. Whether you style, scrape, or test: copy the selector you need and keep moving—clean, fast, and reliable. 👉 Features - Full CSS Path - Full CSS Path (from nearest ID) - Firefox-Style Path (Copy Path) - Optimized Selector - XPath - Playwright Locator (ready to paste into tests) - One-click Copy buttons for every output - Helpful context (tag, id, classes, text snippet) - Lightweight: no bloat, no external requests 👉 Keyboard shortcuts F12 / Ctrl + Shift + I (Open DevTools on Windows/Linux) ⌥ + ⌘ + I (Open DevTools on macOS) 1 — Copy Optimized Selector 2 — Copy Playwright Locator 3 — Copy XPath 4 — Copy Full CSS Path 5 — Copy Full CSS Path (from nearest ID) 6 — Copy Firefox-Style Path (Copy Path) Live pick on page: Ctrl (Win/Linux) / ⌘ (macOS) + Left-Click Toggle “Follow Ctrl/Cmd + Left Click (live)” in the Pathy panel to update the selection directly from the page. 👉 How to use 1. Open Chrome DevTools. 2. Select a node in the Elements panel. 3. Open the Pathy sidebar on the right. 4. Use Copy or the shortcuts above. 👉 Permissions - storage — saves simple UI preferences. - clipboardWrite — enables copy buttons. 👉 Privacy Pathy does not collect or transmit any data. No analytics, no remote calls. 👉 Changelog 1.0.0 – Initial release: Full CSS Path, Full CSS Path (from nearest ID), Firefox-Style Path (Copy Path), Optimized Selector, XPath, Playwright Locator, one-click copy. 1.1.0 – Selector analysis & workflow improvements - Reorganized selector output for faster access to recommended locators - Added new keyboard shortcut order: 1 — Copy Optimized Selector 2 — Copy Playwright Locator 3 — Copy XPath 4 — Copy Full CSS Path 5 — Copy Full CSS Path (from nearest ID) 6 — Copy Firefox-Style Path Use Alt + 1–6 while editing inside a text field - Added selector quality ratings with stability warnings - Added uniqueness and match-count indicators - Click a status indicator to highlight all matching elements - Added live element picking with Ctrl/Cmd + Click - Improved iframe support - Improved Playwright locators using accessible names - Added persistent toggles for highlighting, status, and selector analysis - Refined dark UI, scrollbars, and resize controls - Various reliability and usability improvements