Turn any website into an AI-ready visual blueprint

Try WebForge on any URL

Preview captures one page. Full site crawls land in the extension, coming soon.

Prefer code? Install the package.

The same capture engine as a library and CLI for your scripts, notebooks, and AI agent pipelines. One consistent API for both Python and Node.

PythonPyPI
pip install webforge-theatom
Nodenpm
npm install webforge-theatom
import webforge
 
# Capture one page across desktop, tablet & mobile
result = webforge.capture("anthropic.com")
 
print(result.colors) # ['#f0eee6', '#141413', ...]
print(result.fonts) # ['Anthropic Sans', ...]
print(result.images) # image URLs + inline data-URIs
 
# Crawl the whole domain, then save screenshots + tokens
site = webforge.crawl("anthropic.com", max_pages=10)
site.to_zip("anthropic.zip")

A visual translator between live websites and AI coding agents.

WebForge captures any website as an AI-ready visual blueprint: full page screenshots across desktop, tablet and mobile, an area-weighted colour palette, the fonts actually rendered, image assets, and a crawled sitemap. Instead of describing a design to your agent, you hand it the source of truth so it can rebuild the frontend without drift.

It ships three ways from one capture engine: a free online tool on this page, a Chrome extension for full domain crawls, and the webforge-theatom packages on PyPI and npm for scripts, notebooks and agent pipelines.

What it does

Turns a URL into a structured package of multi-viewport screenshots plus JSON design tokens: colours, fonts, images and sitemap.

Who it's for

Developers rebuilding, refactoring or studying sites with Claude Code, Cursor, Windsurf, Copilot, ChatGPT or Gemini.

Why it's different

Not one flat screenshot. Real breakpoints, exact hex values and full-domain context an agent can actually build against.

Generated Output Package Structure

Every capture complies with the WebForge context specification. It packages visual layouts alongside structural tokens so AI agents can reconstruct frontend code with high precision.

WebForge_Project/
├── pages/
├── home/
├── desktop.png (1440x900 full page)
├── tablet.png (768x1024 full page)
└── mobile.png (390x844 full page)
└── about/
├── desktop.png
└── metadata.json
├── sitemap.json (Discovered domain tree)
└── metadata.json (Global colors, fonts & timestamps)

From a live URL to an AI-ready blueprint in four steps.

Every capture runs the same pipeline, whether you use the online tool, the extension, or the Python and Node packages.

  1. 01

    Point it at a URL

    Paste a link into the online tool, open the extension on any tab, or call capture() from your script. No scheme needed, and an http fallback is built in.

  2. 02

    Capture every viewport

    WebForge scrolls the full page past lazy-loaded content, hides sticky headers, and stitches high-fidelity screenshots at desktop (1440), tablet (768) and mobile (390).

  3. 03

    Extract the design tokens

    It harvests an area-weighted colour palette as exact hex values, the fonts actually rendered, and image assets: the facts a vision model cannot read off a picture.

  4. 04

    Export the package

    Screenshots, per-page metadata, a global token file and a crawled sitemap.json are bundled into a clean ZIP, ready to hand to your AI coding agent.

Everything an agent needs to rebuild a site.

Multi-viewport capture

Authentic desktop, tablet and mobile renders at real CSS breakpoints, not one arbitrary width.

Full-page stitching

Scrolls lazy-loaded content and hides fixed overlays for a seamless top-to-bottom screenshot.

Design-token extraction

Area-weighted colour palette in exact hex, plus the prominence-ordered font stack.

Domain crawler

Discovers and captures same-domain pages sequentially into a structured sitemap.

Structured export

A tidy ZIP of screenshots plus JSON metadata, designed for AI file tools, not just eyeballs.

Library and CLI

Same API on PyPI and npm for notebooks, scripts and agent pipelines.

Frequently Asked Questions

Everything you need to know about capturing websites with WebForge for AI coding workflows.

What is WebForge?

WebForge is a free Chrome extension that captures any website into an AI-ready visual blueprint. It stitches full-page screenshots across desktop, tablet and mobile viewports, crawls same-domain pages, and extracts CSS design tokens, fonts and colors so AI coding agents can rebuild the layout accurately.

Is WebForge free?

Yes. WebForge is completely free to install and use. You can download it from GitHub and support development through Buy Me a Coffee.

Which AI tools does WebForge work with?

WebForge output is optimized for Claude Code, Cursor, Windsurf, GitHub Copilot, ChatGPT, Gemini, Lovable, Bolt.new, v0 and any AI coding workflow that accepts screenshots and design-token context.

How is WebForge different from GoFullPage or a normal screenshot tool?

Unlike a plain screenshot extension, WebForge captures multiple viewports, crawls the whole domain, and exports a structured package containing screenshots plus JSON metadata of colors, fonts and sitemap: everything an AI agent needs to reconstruct the frontend code.

What does the exported WebForge package contain?

Each export is a ZIP containing a pages/ folder with desktop.png, tablet.png and mobile.png per page, a per-page metadata.json (title, URL, fonts, colors), a global metadata.json with combined design tokens and timestamps, and a sitemap.json of the discovered domain tree.

Can I try WebForge without installing the extension?

Yes. The WebForge website has a free online capture tool. Paste any website URL and it instantly returns multi-viewport full-page screenshots (desktop, tablet, mobile) plus extracted colors, fonts and images, downloadable as a ZIP. The online tool captures a single page; installing the extension unlocks full-domain crawling, login and bot-protected pages, and pixel-perfect fidelity.

Is there a Python or Node package?

Yes. The same capture engine ships as webforge-theatom on both PyPI (pip install webforge-theatom) and npm (npm install webforge-theatom), with an identical capture() and crawl() API plus a webforge CLI, ideal for scripts, notebooks and AI agent pipelines.

How does WebForge help AI coding agents rebuild sites accurately?

Vision models are good at layout and poor at precision. WebForge pairs real multi-viewport screenshots with machine-readable design tokens (exact hex colours and the real font stack) so the agent reasons about layout from the image and pulls exact values from the metadata, eliminating colour drift and font guessing.

Does WebForge store or send my captured data anywhere?

No. The extension and packages run captures locally in your own browser or environment and export a ZIP to your machine. The free online tool captures a single page on-demand and returns the ZIP to you without retaining it.

Guides for capturing the web for AI.

All posts →
5 min read

Screenshot-to-code, done right: multi-viewport capture and design tokens

Single-screenshot-to-code tools drift because they lose colour, type and responsive context. Here is why multi-viewport capture with extracted design tokens fixes it.

Read post →
6 min read

How to turn any website into a Claude Code or Cursor context pack

A practical workflow for capturing a reference site as a clean context pack and handing it to Claude Code, Cursor or Copilot so the rebuild matches the original.

Read post →
5 min read

What is a website visual blueprint (and why AI coding agents need one)

A visual blueprint is a structured capture of a website (multi-viewport screenshots plus design tokens) that gives AI coding agents the context they need to rebuild a page accurately.

Read post →

Let’s connect

Found a bug, want to partner, or just have a question? I read every message that lands at connect.theatom@gmail.com.

Report a bug

Something broke or a capture came out wrong? Send the details and I’ll get it fixed.

Partnerships & collabs

Building something WebForge could plug into, or want to work together? Let’s talk.

Everything else

Feedback, feature ideas, press, or a plain hello. The inbox is always open.