Built-in browser

Velork has a full browser built in. Open your local dev server or any website next to the chat, check it at different device sizes, and copy what you see onto the canvas. Agent uses the same browser: you can watch it open pages, click through flows, and test its own changes.

Open the browser

• Press Cmd + Option + 1, or run Open Browser from the command palette.
• In full-screen chat, pick Browser (B) in the agents panel launcher.
• In the editor, click the globe button in the title bar's layout controls.

Type a URL or a search in the address bar. For a local server, localhost:5173 or :5173 is enough.

In full-screen chat, each page opens as a tab in the agents panel, next to the canvas, terminals, and files.

Let Agent use it

Agent can drive the browser on its own: open your app, click, fill forms, read the console and network, and take screenshots. Ask for it in plain words:

Open localhost:3000, sign up with a test account, and fix anything that breaks.

The page stays on screen, so you can follow along.

Point at what to fix with Annotate

Annotate lets you mark a spot on the page and tell Agent what to change.

1. Click Annotate in the browser toolbar.
2. Click an element, or drag to mark an area. Use ↑ and ↓ to adjust what is selected.
3. Type your note. Double-click text on the page to edit it in place.
4. Press Return to send the note.

To send several notes at once, turn on Batch edits in the note. Return then adds each note to the batch, and Send in the browser toolbar (or Cmd + Return in a note) sends them all. Each note shows its status, such as Queued, Working, or Done.

Press Escape to leave Annotate.

Test at device sizes

Click Toggle Responsive Mode to frame the page as a device.

• Pick a preset from Device: iPhone SE, iPhone 15 Pro, iPhone 15 Pro Max, Pixel 8, Galaxy S24, iPad Mini, iPad Pro 12.9", Laptop, Laptop L, or Desktop. Responsive lets you drag the edges to any size.
• Type a Width and Height, or click Rotate to swap them.
• Save a size you use often with Save … as Device....
• Change the zoom, or choose Fit to Window.

The device tools menu emulates conditions on the page:

• Network and CPU throttling
• Color scheme: Light, Dark, or System
• Prefer Reduced Motion and Print Styles
• Vision: blurred vision, reduced contrast, and color vision deficiencies
• Pixel ratio

It also has Save Device Screenshot..., Save Full Page Screenshot..., and Reset Tools.

Copy UI to the canvas

The browser can turn what is on the page into editable design layers:

• Pick Element to Canvas copies one element. Press P while picking to take the whole page.
• Deep Capture... explores hovers, clicks, and animations, and can capture several breakpoints at once.
• Record Animation... records an element or the page while it moves and keeps the motion as keyframes.

Each one copies the layers to your clipboard. Paste them on the canvas with Cmd + V. See Capture websites for the full steps.

More Actions

The More Actions menu has:

• Developer Tools. You can also right-click any element and choose Inspect.
• Copy Screenshot, Save Screenshot..., Copy Full-Page Screenshot, and Save Full-Page Screenshot...
• Hard Reload and Copy Current URL
• Open in Browser to open the page in your default browser
• History... and Clear Browsing History
• Clear Site Data, Clear Cookies, and Clear Cache

When a page does not load

If nothing is listening on a local port, Velork asks you to start your dev server or check its port. For other errors, you can Try again, Clear site data and retry, or Open in browser.

Passkeys aren't available in the built-in browser yet. When a page asks for one, click Open in Browser to continue in your default browser.

The built-in browser keeps its own cookies, so sites you sign in to stay signed in. Use Clear Cookies or Clear Site Data in More Actions to sign out everywhere or reset a site.

Next steps