Chrome 扩展 · 免费
指着屏幕跟 AI 说「就这里」
你看到的问题肉眼一秒就懂,敲成文字却要写半天。
MarkIt 让你在网页上圈一下、写句人话,自动生成 AI 看得懂的结构化指令。
粘贴给 Cursor · Claude Code · Copilot 即用
Acme
产品价格文档
更快构建
现代化产品
面向开发者的一体化平台,让你的产品提速 10 倍。
⚡
极速部署
秒级上线,全球 CDN 加速。
🔒
默认安全
企业级加密与合规保障。
🤖
AI 驱动
智能补全、缺陷检测、自动测试。
实时生成 · 结构化指令
👆 点击或拖拽框选左侧网页里的元素,开始标注
⌘⇧M 切换标注模式
“
那个……登录框上面的按钮,不对,再上面一点的,往右挪挪,颜色也太深了
AI 听不懂,你解释到崩溃。问题不在 AI,而在于——
👁
眼睛看到的
按钮偏了、文字重叠、间距不对——天生难以用文字精确描述。
🤖
AI 需要的
哪个元素、CSS 选择器、源码位置、目标效果——从来没人给它喂全。
三步,把「感觉不对」变成「改这个元素」
01
圈一下
在页面上点选或拖拽框住任意元素 / 区域,红蓝双色实时高亮。
→
02
写句人话
「把这个变成红色警告按钮」——像跟同事说话一样描述你的意图。
→
03
喂给 AI
自动补齐元素定位、CSS 路径、截图,打包成 Markdown,一键复制。
一个工具,两种标注方式
开发模式
告诉 AI「改这里」
精确定位到具体元素,输出 CSS 选择器、代码上下文、坐标尺寸。最适合让 AI 编程助手直接动手改代码。
- 元素定位 + CSS 路径
- 代码片段 + 上下文
- 三档输出详细度
原型模式
告诉 AI「做成这样」
可视化绘制区域 + 一键截图,把设计意图、布局调整、交互想法直观地标注出来交给 AI。
- 区域框选 + 标注标签
- 整页截图捕获
- 视觉化连线说明
细节,都替你想到了
🎯
精准元素定位
自动生成稳定的 CSS 选择器与 DOM 路径。
📐
坐标与尺寸
记录视口位置、包围盒、相对偏移。
📸
一键截图
原型模式捕获整页画面,附在标注里。
🌐
中英双语
界面与输出均支持中英文切换。
💾
跨页持久
标注本地存储,刷新、跨会话不丢失。
🎨
自定义配色
开发 / 原型模式各 8 种主题色可选。