Copyframe

Copy pages to editable Figma layers or HTML. Inspect, edit, save inspiration, and prepare AI design tasks beside the page.

Bring web references into your design and development workflow. Copyframe 2.0 adds a workbench beside the page to explore its structure, inspect and try edits, organize inspiration, and prepare AI design tasks. 1. CORE FEATURES • Copy a full page or selected sections to Figma as editable layers. Hold Shift to add multiple sections to one selection. • Export standalone HTML: copy, download, or preview the HTML and styles for a selected section, then continue in a code editor or AI coding tool. • Save an offline page copy as a ZIP with local resources and notes. Choose an AI rebuild package or a web reference package, then open it locally with Copyframe Viewer. • Inspect page structure, fonts, colors, gradients, and image or video assets from the workbench beside the page. • Try changes to text, layout, and images, then create an AI design task with page evidence and notes. • Save webpages, images, GIFs, and video references in your local inspiration library so you can organize and find them later. • Capture desktop, tablet, mobile, or custom viewport widths. Copyframe can load content outside the viewport when images or cards appear to be lazy-loaded; very long or infinite lists are capped. Results depend on each page's structure and what the browser can access. Text and common layouts are converted where possible. Complex visuals such as canvas, video, and overlays may be kept as images. Copyframe does not promise a pixel-perfect conversion of every website or dynamic effect. 2. PRIVACY AND SAFETY Capture starts only when you choose an action. Copyframe does not continuously read pages in the background or send captured content to Copyframe servers. The browser requests images, fonts, and styles directly from the original page or resource provider. Your inspiration library, recent items, and settings stay on your device. If you choose to use an AI service that you configure, selected page content, assets, prompts, and necessary context are sent to that model provider. Your API key is sent with the request. The provider's terms apply. Requires Chrome 120 or later. Chromium-based Edge is supported. Protected browser pages such as Chrome Settings, New Tab, and the Chrome Web Store cannot be captured. To capture local HTML files, enable “Allow access to file URLs” in the extension settings. Figma is a trademark of Figma, Inc. Copyframe is not affiliated with, sponsored by, or endorsed by Figma, Inc.