Agent Skills by PaulRBerg
A curated collection of agent skills for Claude Code and other AI coding agents.
AI ToolAI ProductivityWebFree
4.4Visit
AI Tool
React Grab
Copy any UI element and give your coding agent the exact source behind it.
Day 43 since launch · Launched 25 August 2026
Made by Shushant LakhyaniKnow about Shushant Lakhyani hereGet all my visual guides hereSee what I can build for youAI+Tech+No-Code+Online Business Mini GuidesJoin the newsletter
Made by Shushant LakhyaniKnow about Shushant Lakhyani hereGet all my visual guides hereSee what I can build for youAI+Tech+No-Code+Online Business Mini GuidesJoin the newsletterBuilt with love by Shushant Lakhyani. Building bestproductivityresources.com
Screenshot or bookmark this page so you find it later, then share it with your network.
What is React Grab?
React Grab points your coding agent at the exact source code behind any UI element you see, so it reaches the right code about twice as fast. It works with Claude Code, Codex and Cursor and installs with a single npx command.
Pros
- Finds the exact source for any on-screen element
- Works with Claude Code, Codex and Cursor
- One-command install
Cons
- Built for React projects
- Speed-up figures come from the project's own benchmarks
Who should use React Grab
React developers who use coding agents and want to point at UI instead of describing it.
Who may not need it
People not using React.
Compare React Grab
Side-by-side comparisons and lists that include React Grab.
React Grab alternatives
Similar resources to React Grab, picked from the directory.
Agent Rules Skill
Generate AGENTS.md files that follow the agents.md convention.
AI ToolAI ProductivityCross-PlatformFree
4.3Visit
Agentfiles
Browse, create, and edit AI agent files across Claude Code, Cursor, Codex and 12 coding tools — from Obsidian.
WebsiteAI ProductivityWeb, macOSFree
4.7Visit
Web Artifacts Builder Skill
An official Claude skill for building elaborate React, Tailwind and shadcn/ui artifacts on claude.ai.
AI ToolAI ProductivityWebFree
4.8Visit
Figma to Code Skill
A Claude Code skill that turns Figma designs into working frontend code.
AI ToolAI ProductivityWebFree
4.6Visit
OpenHarness
Open-source software and hardware for building with coding agents across software, design, circuits, data and video.
AI ToolAI ProductivityCross-Platform, LinuxFree
4.6Visit
Free alternatives to React Grab
Free resources that cover similar ground.
Builder.io Skills
A collection of agent skills from Builder.io for smarter AI-assisted development.
AI ToolAI ProductivityCross-PlatformFree
4.5Visit
AI-First Toolkit
Open-source Claude Code and Codex skills for AI-first work.
AI ToolAI ProductivityCross-PlatformFree
4.4Visit
Agentation
The visual feedback tool for AI coding agents.
AI ToolAI ProductivityWeb, Cross-PlatformFree
4.3Visit
Dely
A multi-harness control protocol that turns requests into approved design contracts for AI coding agents.
AI ToolAI ProductivityCross-PlatformFree
4.3Visit
Ponytail
Makes your AI agent think like the laziest senior developer in the room.
AI ToolAI ProductivityCross-PlatformFree
4.3Visit
Threadport
Portable, verifiable work state for coding agents.
AI ToolAI ProductivityCross-PlatformFree
4.3Visit
Featured on Best Productivity Resources
Made React Grab? Add this free badge to your website or README. It links to this page.
<a href="https://bestproductivityresources.com/resources/react-grab" target="_blank" rel="noopener"><img src="https://bestproductivityresources.com/badges/featured-light.svg" alt="Featured on Best Productivity Resources" width="250" height="54" /></a>