Item logo image for UI Surgeon

UI Surgeon

5.0(

5 ratings

)
ExtensionDeveloper Tools8 users
Item media 3 (screenshot) for UI Surgeon
Item media 1 (screenshot) for UI Surgeon
Item media 2 (screenshot) for UI Surgeon
Item media 3 (screenshot) for UI Surgeon
Item media 1 (screenshot) for UI Surgeon
Item media 1 (screenshot) for UI Surgeon
Item media 2 (screenshot) for UI Surgeon
Item media 3 (screenshot) for UI Surgeon

Overview

Inspect, edit, and mimic UI elements with live CSS and content editing

UI Surgeon: Operate on Your Web UI with Precision Stop fighting with complex DevTools panels just to make simple visual tweaks. UI Surgeon is a professional-grade extension designed for Developers, Product Owners, and BAs to surgically inspect, edit, and audit any live website. Whether you are debugging a layout, checking accessibility, or prototyping new content, UI Surgeon provides the precise tools you need in a clean, side-panel interface. Why You Should Install UI Surgeon Surgical Precision: Select any element on a page to instantly view its accurate CSS rules and computed styles. No more digging through nested DOM trees. AI-Powered Styling: Get instant, context-aware color and style suggestions from Gemini. Perfect for finding accessible palettes that match your brand. Layout Stress-Testing: Instantly see if your design breaks with long text or different font sizes. Test "Copy-Fit" before you even touch the code. Accessibility (WCAG) Audits: Real-time contrast checks (AA/AAA) ensure your site is inclusive and compliant with international standards. Live Prototyping: Swap images and rewrite text directly on the live page to demonstrate new ideas to stakeholders in seconds. Key Features Deep CSS Inspection: Fetches accurate CSS paths and rules using Chrome's Debugger API for 100% accuracy. Live Editor: Change colors, margins, and fonts via an intuitive UI and see the result live on the page. Smart Content Swapper: Easily test different images or headlines without a staging environment. VS Code Ready: Quickly copy CSS selectors or generate code-search queries to find the exact component in your source files. Clean & Lightweight: Operates entirely within the Chrome Side Panel to keep your workspace uncluttered. Who is this for? Developers: For rapid CSS prototyping and layout debugging. BAs & Product Owners: For verifying copy-fit, accessibility, and branding consistency on live builds. Designers: For auditing live implementations against original design specs.

Details

  • Version
    1.0.0
  • Updated
    February 10, 2026
  • Size
    71.92KiB
  • Languages
    English
  • Developer
    Email
    yogeshkamboj123@gmail.com
  • Non-trader
    This developer has not identified itself as a trader. For consumers in the European Union, please note that consumer rights do not apply to contracts between you and this developer.

Privacy

UI Surgeon has disclosed the following information regarding the collection and usage of your data. More detailed information can be found in the developer's privacy policy.

UI Surgeon handles the following:

User activity
Website content

This developer declares that your data is

  • Not being sold to third parties, outside of the approved use cases
  • Not being used or transferred for purposes that are unrelated to the item's core functionality
  • Not being used or transferred to determine creditworthiness or for lending purposes
Google apps