interestoffice

DevSniper brings two tools in one lightweight plugin:
<ul>
<li>Front-end Inspector for logged-in admins (or a custom capability via <code>devsniper_required_cap</code>). Hover to highlight, click to view tag/ID/classes, size and offsets, DOM path, CSS selector, source detection (Elementor/Gutenberg/Theme), copy buttons, quick “Open Editor” link, favourites, and a saved per-user toggle.</li>
<li>Admin Search (command palette) inside wp-admin with <code>Ctrl/Cmd + K</code>: quick results for posts/pages, media, users, admin pages, plus per-user favourites with a star toggle. Clean UI that respects WordPress styling, with tabs for General/Sources/Premium settings.</li>
</ul>
No tracking, no external requests, no locked “pro-only” code. Everything in this free version is fully usable.
<h3>SECURITY CHECKLIST</h3>
<ul>
<li>Capabilities: Inspector gated by <code>manage_options</code> (filter <code>devsniper_required_cap</code>); admin search limited to <code>edit_posts</code>.</li>
<li>Nonces: All AJAX routes verify <code>devsniper_nonce</code> plus capability checks before mutating data.</li>
<li>Sanitization/Escaping: All incoming text via <code>sanitize_text_field</code>/<code>esc_url_raw</code>; outputs escaped in HTML; URLs escaped.</li>
<li>External requests: None. No telemetry or third-party calls; assets served locally.</li>
</ul>

DevSniper – Global Developer Search

Fast admin search + front-end inspector for admins to identify elements and jump to editing.

CodingBunny

CodingBunny CSS Inspector adds a clean, DevTools-style sidebar to your WordPress frontend, letting administrators visually inspect any element and copy its CSS with a single click. 
Perfect for theme customization, debugging, and quick styling adjustments—without ever opening the browser DevTools.
The inspector displays full CSS blocks, selector paths, HEX color values, used CSS variables, and ready-to-copy pseudo-state styles like :hover, :focus, and :active.
Designed for power and simplicity, and visible only to logged-in administrators.
<h4>Features</h4>
DevTools-like inspection sidebar, launched from the admin bar
Full CSS block viewer for any element (full or simplified selector paths)
Ready-to-copy pseudo-state blocks: :hover, :focus, :active
Automatic extraction of all CSS variables used by the selected element
Copy-to-clipboard buttons with instant visual feedback
Lightweight and unobtrusive—runs only for authenticated admins
Never loads for visitors or on the WordPress dashboard
<h4>Installation</h4>
Download codingbunny-css-inspector.zip
Unzip the file
Upload the codingbunny-css-inspector folder to /wp-content/plugins/
Activate CodingBunny CSS Inspector from the Plugins screen
<h3>Usage</h3>
Click “CSS Inspector” in the WordPress admin bar (frontend only)
Hover any element to preview its CSS in the sidebar
Click to lock the selection; press ESC to unlock or click ✕ to close
Toggle between full or compact selector paths
Use the copy buttons to instantly copy selectors and CSS blocks (with green confirmation)

CodingBunny CSS Inspector

Inspect and copy the CSS of your site’s elements directly from the frontend—fast, simple, and DevTools-inspired.

DevSniper – Global Developer Search vs CodingBunny CSS Inspector