Media
6 items
Description
Yank UI elements & send to AI agents like Cursor, Claude Code, Copilot & more React Yank lets you grab any element on a webpage and copy its details to your clipboard - perfect for providing context to AI coding assistants. FEATURES: • Hold Cmd+C (Mac) or Ctrl+C (Windows) and hover to yank any element • Quick Actions Palette - Choose what to copy: HTML, CSS selectors, test selectors • Multi-Select Mode (Shift+M) - Select and copy multiple elements at once • Smart Component Detection - Detects React, Vue, Angular, Svelte components • Tailwind CSS Extraction - Extracts Tailwind classes from elements • Test Selector Generator - Generates Playwright and Testing Library selectors • Design Token Extraction - Colors, typography, spacing, borders • Network Context - Shows API endpoints that provided the data • Parent Chain View - See the full DOM hierarchy • Snippet Library - Save and reuse frequently yanked elements KEYBOARD SHORTCUTS: • Cmd/Ctrl + C (hold) - Yank element under cursor • Cmd/Ctrl + Shift + Y - Toggle extension on/off • Shift + M - Enter multi-select mode • Enter - Confirm multi-select • Esc - Cancel PERFECT FOR: • Cursor IDE users • Claude Code users • GitHub Copilot users • Any AI-assisted development workflow OUTPUT FORMATS: • JSON - Structured data format • Markdown - Documentation-friendly • Plain Text - Simple copy-paste Based on React Grab by Aiden Bai. Privacy: This extension runs entirely in your browser. No data is sent to external servers.