UISelector2AI

Name: UISelector2AI
Rating: 4.67 (3 reviews)
Author: benxu.huang

UISelector2AI extracts CSS selectors and HTML and converts them into AI-ready prompts for updating UI code or tests.

As of June 2026, UISelector2AI has 141 users and a 4.67/5 rating from 3 reviews in the Developer Tools category.

benxu.huang Developer Tools

Chrome Web Store ↗.crx

Users+88.0%

141

Rating−6.6%

4.67

3 reviews

Reviews+50.0%

Version

1.2

Manifest V3

90-day change · In the last 90 days this extension 1 version update, changed permissions.

History

11 snapshots

Tracking since Apr 1, 2026.

View as table

Date	Users	Rating	Reviews	Version
Apr 1, 2026	75	5.00	2	1.1
Apr 16, 2026	78	5.00	2	1.1
Apr 22, 2026	101	4.67	3	1.1
Apr 27, 2026	110	4.67	3	1.1
May 4, 2026	115	4.67	3	1.1
May 10, 2026	121	4.67	3	1.1
May 15, 2026	134	4.67	3	1.1
May 21, 2026	135	4.67	3	1.2
May 28, 2026	127	4.67	3	1.2
Jun 4, 2026	132	4.67	3	1.2
Jun 9, 2026	137	4.67	3	1.2
Now	141	4.67	3	1.2

Changelog

May 15, 2026

permissions

activeTab, storage, sidePanel

activeTab, storage, sidePanel, offscreen

May 15, 2026

description

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、屬性與結構定位）。

如何使用
啟動檢測模式：按下 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.

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.

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.

May 15, 2026
host_permissions
```
(empty)
```
```
<all_urls>
```

Permissions & access

Permissions: activeTabstoragesidePaneloffscreen
Host access: <all_urls>

Screenshots

About

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.