DOM context selector — Select elements for agent context

The DOM context selector lets you click on elements in the browser and attach them to chat messages. Instead of describing a UI change, point at the element and say “change this.” Selected elements attach their structure, styles, position, and selector path to your next message.

​

Using the selector

1. Activate — Keyboard shortcut or toolbar button
2. Hover — Elements highlight as you move
3. Click — Select the element. Select multiple before sending
4. Send — Selected elements appear as attachments

​

What the agent receives

When you select a DOM element, the agent gets:

• HTML structure — Outer HTML and DOM position
• Computed styles — Key CSS properties
• Bounding box — Position and dimensions
• Selector path — A unique CSS selector

​

Tips

• Be specific — Select the most specific element. A button is better than the entire page.
• Combine with text — Pair selection with instructions: “Make this button larger and use the primary color.”
• Select multiple elements — Show the agent a pattern or request changes across components.

​

Keyboard shortcut

Full keyboard shortcuts →

​

Related

• Browser & agent concept →
• Agent context concept →