SelectorGadget

What is SelectorGadget?

The SelectorGadget tool is an open-source application that simplifies the generation and discovery of CSS selectors for complex websites. By installing the Chrome extension or utilizing the bookmarklet, users can easily navigate to any webpage and launch the tool. A small box will appear in the bottom right corner of the site, allowing users to click on specific page elements they wish to target with their CSS selector. SelectorGadget will then generate a minimal CSS selector for the selected element and highlight (in yellow) all the elements that match the current selector. Users can further refine the selector by clicking on highlighted elements to remove them from the selection or clicking on unhighlighted elements to add them to the selector. This iterative process of selection and rejection enables users to precisely craft the perfect CSS selector for their specific needs, even on the most complicated websites

Highlights

• Open-source tool for generating and discovering CSS selectors
• Easily accessible through a Chrome extension or bookmarklet
• Allows users to select and refine page elements to create targeted CSS selectors
• Provides visual feedback by highlighting elements matched by the current selector
• Enables an iterative process of selection and rejection to precisely craft the desired CSS selector