keidkhcpbfnkjlmbifipahiklimhffjl
Extract structured DOM context from web pages, optimized for AI agents and LLMs DOM Extractor for LLMs is a developer tool that captures structured DOM context from any web page, formatted specifically for Claude Code or other AI development tools. Drag Mode (Cmd+Shift+. / Ctrl+Shift+.) • Draw a rectangle to select multiple elements • Perfect for capturing sections of a page • Outputs all elements with hierarchy and relationships Precision Mode (Cmd+Shift+, / Ctrl+Shift+,) • Hover to inspect individual elements in real-time • See live preview of selectors, dimensions, and predicted actions • Click to capture detailed element information
DOM X-Ray
See through the DOM to visually debug CSS positioning. Toggle DOM X-Ray to trigger CSS styles that outline and illuminate DOM element structure.
Sneaky Clean
Remove a website's history, cookies, and cache on a per-site basis. Sneaky Clean is a privacy extension for Google Chrome that automatically removes browsing history, cache, and/or cookies when a tab is closed, navigated away from, or the browser is closed. How to use: Browse to any website, open the extension, and tick the slider from any of the following options: History Cache Cookies SneakyClean will remember the choices you've made for each website. Great for developers and privacy lovers who want more control over their browser's history, cache, and cookies with just two clicks!
HTML/CSS Extractor
Extract HTML & CSS from any element with live preview, smart selector simplification, and syntax-highlighted editor A powerful DevTools extension for web developers and designers to extract clean, production-ready HTML and CSS from any DOM element. Features include: • Live preview with responsive breakpoints • Smart CSS selector simplification • Syntax-highlighted code editor • @font-face rule extraction • One-click copy to clipboard • Customizable extraction settings Perfect for copying component styles, debugging layouts, and rapid prototyping. 2. Navigate to HTML/CSS Tab First, make sure you're on the Elements tab in DevTools. Then, look for the "HTML/CSS" tab in the DevTools panel. It may be in the overflow menu (») if you have many extensions installed. 3. Select an Element You can select elements in several ways: - Method 1 - Direct Selection: In the Elements tab, click on any HTML element in the DOM tree to select it, then switch to the HTML/CSS tab to view the extracted code - Method 2 - Element Picker: Click the element picker icon (cursor with square) in the top-left corner of DevTools, then click on any visible element on the webpage. This will automatically select it in the Elements tab - Method 3 - Right-click Inspect: Right-click on any element on the webpage and select "Inspect" from the context menu. This will open DevTools with that element already selected Tip: After selecting an element using any method, make sure to switch to the "HTML/CSS" tab to see the extracted code and live preview. 4. View Extracted Code The extension will automatically extract and display the HTML and CSS for your selected element, along with a live preview. 5. Copy or Edit Edit the code in the syntax-highlighted editor, then click the copy button to copy it to your clipboard.
Arrow Up - ChatGPT History
A terminal history like for your ChatGPT Prompts ⭐ The simplest and minimalist ChatGPT prompt history extension. ⬆️ Avoid scrolling back up to find previous prompts and simply use ⇧ + ↑ ↓ to browse your prompt history. ⚡️ Quickly access your previous prompts to modify them if you made a mistake.
