SelectorKit

Count, inspect, and style page elements instantly — auto-detect patterns, pick elements, and save CSS rules per site.

SelectorKit is a lightweight, intuitive Chrome extension for Web Developers, QA Engineers, Designers, and Content Creators. Effortlessly inspect web page structures, count repeated components, analyze element attributes, and inject persistent custom CSS rules on any website — all directly from a clean visual interface without opening Chrome DevTools. Whether you are auditing DOM elements, validating web layout components, scraping content structures, or tweaking website styles on the fly, SelectorKit provides the essential tools to inspect and modify web pages instantly. -------------------------------------------------- KEY FEATURES -------------------------------------------------- 1. 🎯 Visual Element Picker - Click any element on an active web page to inspect it instantly. - Automatically generates optimized CSS selectors (ID, class combination, or tag structure). - Displays real-time Tag Name, ID, Classes, and dimensions (Width x Height). 2. ⚡ Smart Auto-Detect Engine - Scan any web page with one click to discover repeating DOM structures. - Automatically groups and displays cards, buttons, headings, links, images, tables, list items, and form inputs with exact match counts. 3. 🔍 Advanced CSS Selector & Element Counter - Input any standard CSS selector (e.g., .card, button.btn-primary, h2, input[type="text"]). - Instantly view match counts and detailed breakdowns of matched elements. - Toggle live on-page element highlighting (with distinct neon outlines) to visually locate items on the web page. 4. 🎨 Custom CSS Injector & Style Tweaker - Apply custom CSS rules directly to selected elements or globally on the active page. - Built-in Quick Action buttons for fast layout testing: • Hide: Instantly set display: none; on target elements. • Show: Restore hidden elements. • Highlight: Apply high-visibility borders for visual debugging. - Live preview changes instantly on the page. 5. 💾 Domain-Specific Rule Saver & Manager - Save custom CSS rules tied specifically to the current domain name (e.g., github.com, example.com). - Saved rules persist automatically across page reloads and browser sessions. - Manage saved rules with domain toggle controls, individual delete options, and clear-all functionality. 6. 📤 One-Click Data Export - Export selector analysis results in plain text or clean JSON format. - Copy data straight to your clipboard for documentation, QA bug reports, or automation scripts.