Item logo image for F12

F12

ExtensionDeveloper Tools
Item media 4 (screenshot) for F12
Item media 1 (screenshot) for F12
Item media 2 (screenshot) for F12
Item media 3 (screenshot) for F12
Item media 4 (screenshot) for F12
Item media 1 (screenshot) for F12
Item media 1 (screenshot) for F12
Item media 2 (screenshot) for F12
Item media 3 (screenshot) for F12
Item media 4 (screenshot) for F12

Overview

Inspect elements, edit CSS live, and extract fonts, colors & assets from any page. One shortcut, no DevTools. 100% local.

F12 is a lightweight page inspector that lives in a single keyboard shortcut. on any page to inspect elements, edit CSS live, and extract fonts, colors, and assets — without opening DevTools. INSPECT ELEMENT Hover any element to see its size, margins, alignment guides, and key computed styles at a glance. Click to pin it and get a unique CSS selector plus a full, editable list of its styles. EDIT CSS LIVE Change any property and watch the page update instantly — dropdowns for layout properties, native color pickers for colors. Every change is tracked as a clean diff (old value → new value) that you can revert per property, per element, or all at once. YOUR CHANGES, SAVED Edits are saved automatically, per page. Review them in the Changes panel, copy them as clean CSS, download them as a .css file, or come back later and re-apply saved edits with one click. Pin the pages you care about so they're never cleared. EXTRACT ASSETS Scan any page for images, SVGs, and media. Preview, copy, or download individually — or select several and download them in one batch. COLORS See every color a page actually uses, with usage counts and where each appears (text, borders, fills, gradients) — in HEX, RGB, or HSL. Pick any pixel on screen with the built-in eyedropper. FONTS Browse the fonts a page really renders: families, sizes, weights, and the tags that use them, with live previews. Copy any family name in one click. PRIVATE BY DESIGN F12 runs 100% locally. No servers, no accounts, no analytics, no data collection — nothing ever leaves your machine. It requests only minimal permissions and runs only when you invoke it. WHO IT'S FOR Designers reviewing shipped pages. Developers measuring spacing without opening DevTools. Product managers mocking up changes on the live site and exporting the CSS. Anyone who's ever asked "what font is that?" GETTING STARTED Click the toolbar icon on any page. Hover to inspect, click to pin, Esc to close.

Details

  • Version
    1.0.1
  • Updated
    July 15, 2026
  • Offered by
    shruthiskgowda1
  • Size
    47.99KiB
  • Languages
    English
  • Developer
    Email
    shruthiskgowda1@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

Manage extensions and learn how they're being used in your organization
The developer has disclosed that it will not collect or use your data. To learn more, see the developer’s privacy policy.

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