Layerlift | &Dolphin

Overview

A tool that turns a web page back into editable Figma layers. Capture the page with the Chrome extension and the Figma plugin rebuilds the layout, colors, text and images as layers — frames, text and shapes, not a flat screenshot.

Capture handles multiple viewports and full pages, and works on static sites, SPAs and pages behind a login. Position, spacing and typography carry over from CSS, and because it is rule-based rather than AI the same page gives the same result twice. CSS variables become Figma Variables and repeated images become Components. Conversion happens in the browser, and the original HTML is never stored.

Shipped and publicly available. Free covers three conversions a day; unlimited imports, responsive viewports and design-token export are Pro — $8/month with a 10-day trial.

Stack

Area	Technology	Why we chose it
Shared	TypeScript · pnpm monorepo · vitest	All three pieces share one schema, so the schema is its own package, pinned by tests.
Capture	Chrome extension (MV3) · Chrome DevTools Protocol	Real resolution emulation needs CDP — resizing the window does not move media queries.
Convert	Figma Plugin API · Figma Variables	CSS variables have to become Figma Variables for design tokens to survive the trip.
Transfer	Single-file Node relay server	Kept to one dependency-free file — it only forwards; it is not a payment gate.

Roadmap

Bundle schema

Done2026.01.10 – 2026.02.20

Pinned the contract the three pieces share, first

Capture pipeline

Done2026.02.21 – 2026.04.10

Resolution emulation, tree pruning, image compression

Figma conversion

Done2026.04.11 – 2026.05.25

Absolute placement, font fallback, per-node error isolation

Relay and release

Done2026.05.26 – 2026.06.30

Paired transfer and store release