electron-ui-inspector

Community

Inspect live Electron UIs, ship context to AI.

AuthorAskTinNguyen
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Enables developers to inspect live Electron UI elements and capture structured context for AI-assisted UI edits.

Core Features & Use Cases

  • Unified main/renderer inspector with shared contracts for mode, snapshot, and state
  • Overlay-based element selection and data capture including selectors, bounds, HTML, text, and computed styles
  • Structured chat handoff with agent-context prefix and optional React fiber metadata
  • Read-only agent parity tools providing access to the same snapshot
  • Safe-mode and payload safeguards to minimize data leakage

Quick Start

Open the app in development and toggle the UI Inspector, hover elements to highlight them, and click to capture a snapshot ready to send to chat.

Dependency Matrix

Required Modules

None required

Components

references

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: electron-ui-inspector
Download link: https://github.com/AskTinNguyen/vesper-team-skills/archive/main.zip#electron-ui-inspector

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.