UIFoxy
UIFoxy vs React Grab
Last updated: October 4, 2026
Both tools turn an element on your screen into context a coding agent can use. React Grab is an open-source package you add to your project: hover an element, press ⌘C or Ctrl+C, and paste the element with its component stack and source locations. UIFoxy is a Chrome extension that needs nothing in the project: you click elements, write a request on each, and copy one prompt with two file:line addresses and a confidence label for each.
Side by side
| Aspect | UIFoxy | React Grab |
|---|---|---|
| Installation | A Chrome extension. Nothing is added to the project. | npx grab@latest init at the project root, or a script tag or import added to the app for development. |
| How you select | Click the toolbar icon, then click the elements. Esc leaves. | Hover an element and press ⌘C or Ctrl+C. |
| What you paste | A Markdown prompt: where the element is written and where its component is used, each with a confidence label, your request for each element, and DOM context. | The element’s HTML and its component stack with source locations. |
| Agents | Any. The prompt is text on your clipboard. | Its site names Claude Code, Codex and Cursor. |
| Documented setups | React 18 and 19 in development mode, with Vite and Next.js (file and line on React 19 need 19.1 or later; details). Other pages get selector, structure and text. | Next.js (App Router and Pages Router), Vite and Webpack. |
| Price | Free: 5 copied prompts a day. Pro: $10 once, no subscription. | Open source, MIT license. |
When to pick React Grab
- You want an open-source tool you can read and change, under the MIT license.
- You are fine adding a package or a script to the project.
- You like a one-keystroke flow: hover, ⌘C or Ctrl+C, paste.
- You want to build your own picker. Its
react-grab/primitivesAPI exposes hit testing, source context, page freezing, clipboard access and editor navigation.
When to pick UIFoxy
- You don't want to touch the project: no dependency, no command, no change to the dev server. You click the icon on the tab you already have open.
- You want two separate, labeled addresses in the prompt: where the element is written and where its component is used, each with its own
file:line. - You want the prompt to say how sure it is (
exact,mapped,name-only,dom-only), and to still carry selector, structure and text when there is no source information. - You change several things at once: select several elements, write a request on each, and copy one prompt. Selections survive hot reload and a page refresh.