DOM Inspector Plus

About

See a UI component you love on any website? Extract it in one click and get an AI-ready prompt you can paste into
   Claude, v0, Cursor, or ChatGPT to recreate it perfectly.

  DOM Inspector Plus is the missing link between browsing and building. Instead of screenshotting, manually
  inspecting, or describing layouts in words — just hover, click, and copy.

  HOW IT WORKS:
  1. Click the extension icon or press Cmd+Shift+X to start inspecting
  2. Hover over any element to see it highlighted with its box model
  3. Click to extract the full component — not just one element, but the entire logical component boundary with all
   children
  4. Pick your export format and send it to your AI tool of choice

  WHAT MAKES IT DIFFERENT:
  - Component-level extraction: Click a button inside a card, and it intelligently selects the whole card. Use [
  and ] keys to adjust the boundary.
  - 90% less noise: Styles are diffed against browser defaults. You only see what matters — no more wading through
  300 inherited CSS properties.
  - CSS to Tailwind mapping: Every style is automatically converted to Tailwind classes.
  - 5 export formats: AI Prompt (natural language), React JSX with Tailwind, HTML + CSS, Tailwind-only class
  strings, or structured JSON.
  - Interaction states: Capture hover, focus, and active states so AI knows exactly what changes on interaction.
  - Design system extraction: Scan an entire page for its color palette, typography scale, spacing patterns, and
  more.
  - Inspection history: Every extraction is auto-saved. Search, favorite, and organize past inspections.

  AI INTEGRATIONS:
  - Claude — opens claude.ai with your prompt ready
  - v0 — optimized for shadcn/ui + Tailwind
  - Cursor — copies prompt for Cursor chat

  KEYBOARD SHORTCUTS:
  - Cmd+Shift+X: Toggle inspector
  - Cmd+Shift+C: Quick copy
  - [ / ]: Expand/contract component boundary
  - Esc: Stop inspecting

  Free, open source (MIT), and privacy-friendly. No data leaves your browser. No tracking. No accounts.

  GitHub: https://github.com/Sreelal727/dom-inspector-plus