Media
2 items
Description
UISelector2AI extracts CSS selectors and HTML and converts them into AI-ready prompts for updating UI code or tests. UISelector2AI - AI 提示詞專用網頁元素選取器 一鍵擷取網頁元素選擇器 (Selectors) 與 HTML，專為 AI 程式碼助手打造。 UISelector2AI 幫助開發者與 Prompt Engineer 快速提取網頁上精確的 CSS 選擇器、HTML 結構。它能將數據格式化為乾淨、適合 AI 閱讀的提示詞 (Prompt)，完美搭配 ChatGPT Codex、Claude Code、Antigravity 或 Gemini CLI 使用，以自動定位網頁元素並使 AI 工具能快速更新前端程式碼。 主要功能 點擊即選 (Point & Click)：游標懸停高亮顯示，點擊即可擷取元素。 AI 專用輸出：自動生成結構化的 Prompt，包含 URL、選擇器。 側邊欄工作區：在側邊欄 (Side Panel) 檢視與管理您已選取的元素列表。 智慧選擇器：生成穩健的 CSS 選擇器（支援 ID、Class、屬性與結構定位）。 Side Panel 管理：集中檢視、拖曳排序與編輯所有註解 Network Capture：擷取網路請求並一起加入 Prompt 語音輸入：在註解視窗與 Context 區使用麥克風輸入 如何使用 啟動檢測模式：按下 Alt+O 或點擊 Popup 中的 "Start Inspect"。 選取元素：點擊網頁上您想參考的 UI 元素。 開啟側邊欄：按下 Alt+L 查看已選取的元素清單。 匯出 Prompt：點擊 "Copy Prompt" (Alt+C) 複製格式化後的文字。 鍵盤快速鍵 開啟檢測模式 (Toggle Inspect)：Alt + O 關閉檢測模式 (Toggle Inspect)：Alt + O 或 Esc 開啟側邊欄 (Side Panel)：Alt + L 複製 Prompt：Alt + C 清除標註：Alt + X 隱私權政策 本擴充功能完全在您的裝置上本地運行。不會將任何數據發送到外部伺服器。 🎉 感謝開源貢獻者 Rzyfront 貢獻出色的設計及功能升級（深色/淺色主題自動切換、優化的 UI 體驗、註解拖曳排序及內容擷取等實用功能）。 UISelector2AI - Web Element Selector for AI Prompts One-click retrieval of web element Selectors & HTML for AI coding assistants. UISelector2AI helps developers and prompt engineers quickly extract precise CSS selectors, HTML structure from any webpage. It formats the data into a clean, AI-ready prompt, perfect for feeding into LLMs like ChatGPT Codex, Claude Code, Antigravity or Gemini CLI to automatically locate web elements and update frontend code or tests. Key Features Point & Click Inspection: Hover to highlight elements, click to capture. AI-Ready Output: Automatically generates a structured prompt with URL, Selectors, and HTML context. Side Panel Workflow: Review and manage your selected elements in a convenient side panel. Smart Selectors: Generates robust CSS selectors (ID, Class, Attribute, and Structural). How to Use Activate Inspect Mode: Press Alt+O or click "Start Inspect" in the popup. Select Elements: Click on any UI element you want to reference. Open Side Panel: Press Alt+L to view your list of selected elements. Export Prompt: Click "Copy Prompt" (Alt+C) to get the formatted text for your AI tool. Network capture: capture API requests and include them in the exported prompt Voice input: dictate annotation text and page context with the microphone Keyboard Shortcuts Open Inspect Mode: Alt + O Close Inspect Mode: Alt + O or Esc Open Side Panel: Alt + L Copy Prompt: Alt + C Clear Annotations: Alt + X Privacy Policy This extension runs entirely locally on your device. No data is sent to external servers. 🎉 Acknowledgments & Contributors A special thanks to developer Rzyfront for the outstanding contributions, including dynamic Dark/Light theme support, significantly enhanced UI/UX, annotation drag-and-drop reordering, and element content extraction features.