Capture websites

Start from real UI instead of a blank canvas. Velork captures a website as editable design layers and pastes them onto your canvas. You can capture a whole page, one element, every interactive state, or a recorded animation.

There are three ways in:

Agent's captures land on the current canvas page, to the right of what is already there. Browser and Chrome captures go to your clipboard, and you paste them where you want.

Ask Agent

In any chat mode, give Agent a URL:

Capture https://linear.app and rebuild its hero in our app.

Agent opens the site in the built-in browser, captures the whole page as it looks, and pastes it onto the canvas with the capture selected. This capture is a still: it does not include hover states or motion. For those, use the browser tools below.

Copy one element from the built-in browser

1. Open the page in the built-in browser.
2. Click Pick Element to Canvas in the browser toolbar.
3. Click the element you want. Press Escape to cancel.
4. When the page shows Copied, switch to the canvas and press Cmd + V.

Capture every state with Deep Capture

Deep Capture explores the page's hovers, clicks, and animations, then copies every state to the canvas.

1. In the browser, open More Actions and choose Deep Capture....
2. Leave every breakpoint off to capture the current view only, or switch on the breakpoints you want. All breakpoints captures the same page at each size, side by side. The card estimates how long it takes.
3. Click Capture. With breakpoints on, the button reads Capture 1 breakpoint or Capture 3 breakpoints (or however many you picked).

A card on the page shows progress. Click Stop to end early. When it finishes, the states are on your clipboard: switch to the canvas and press Cmd + V.

Record an animation

Recordings keep a site's motion. The recorded animation becomes keyframes on the canvas that you can edit on the Motion timeline.

1. In the browser, open More Actions and choose Record Animation....
2. Click the element to record, or press P to record the whole page.
3. Interact with the page so the animation plays. Keep the browser open and visible: animations that play while it is hidden are not recorded.
4. Click Stop Recording and Save. The page shows Copied with motion and how many layers are animated.
5. Paste on the canvas with Cmd + V, then switch to Motion mode to see the keyframes.

See Motion and prototypes.

From capture to code

1. Capture the page or element.
2. Edit the layers on the canvas: swap copy, colors, and images for your own.
3. Ask Agent in Develop mode to build the selection.

Plan limits

Web captures count toward your plan's monthly limit. See Plans and usage.

Pages behind a sign-in

The built-in browser keeps its own cookies. To capture a page you have to sign in to, open the site in the built-in browser and sign in there first, then capture it, or ask Agent to. Velork Capture for Chrome captures the tab as you see it in Chrome, so it works on pages you are signed in to there.

Next steps