Capturing pages
Two ways to capture screens—Browser Extension or Public URL—and how captures power prototypes, components, and design tokens.
Overview
Alloy offers two ways to capture screens from your product, app, or website: Browser Extension or Public URL. Each approach fits different scenarios—choose the one that matches your page type and security needs.
Browser extension
The Alloy Browser Extension is the fastest and most accurate way to capture a product page for prototyping—ideal for private pages, pixel-perfect accuracy, and maximum consistency with your design system.
Get started:
- Install the extension from the Chrome Web Store via alloy.app/extension.
- Pin it (📌) so it’s always within reach.
- Open the extension on any page and click Capture.
After a brief processing period, Alloy creates a prototype you can modify with prompts and visual editing.
Tip: The extension currently supports Chromium-based browsers.
Demo video (recommended): Short looping walkthrough showing installation and the capture process.
Public URL
If a page is publicly accessible without login, paste its URL into Alloy and we’ll recreate it—no installation required. Public URL captures produce high-quality results and are perfect for quickly reproducing static, public designs (e.g., recreating the Google home page in seconds).
Accessing captures
When you capture a page, Alloy stores a copy as a Capture. The original Capture remains intact even if you later change the prototype.
You can:
- Reuse a Capture to start additional prototypes later.
- Keep multiple prototypes linked to the same original Capture.
- Iterate with confidence without affecting the preserved source.
Generating components & design tokens
Every capture doesn’t just give you a prototype and stored Capture—it also analyzes the page to detect components and design tokens (e.g., colors, typography, spacing, radii, shadows). These detections improve the quality and consistency of future prototypes.
How it helps:
- Components identified in a Capture can be reused by name or description in new prototypes.
- Extracted design tokens inform styling in subsequent prototypes, reducing manual tweaks and drift from your design system.
Example: After capturing your dashboard, create a new prototype and say, “Add a sidebar like the one from my dashboard Capture.” Alloy pulls in that sidebar—with structure and tokens—so it matches your previously captured design.