LilLabr - Website to Figma

Website to Figma from Chrome. Capture rendered HTML to Figma as editable layers. No sign-in needed to capture.

Website to Figma for your next redesign. LilLabr brings supported webpage content into editable layers with HTML to Figma capture, giving you an existing interface to work from instead of a blank canvas. Explore a redesign, collect useful UI references, or compare a live interface with your design. CHOOSE WHAT TO CAPTURE • Screen: bring the currently mounted page state across in a clipped Figma frame. • Full page: prepare the loaded document and eligible inner scrollers; with a modal open, capture the whole modal. Preparation is bounded, and virtualized content may only exist while visible. • Pick element: hover and select a detail with LilLabr’s on-page lilac corners and keyboard controls. MOVE INTO FIGMA Capture in Chrome, then paste into Figma. You can also save a .labr file and open it with the companion LilLabr Figma plugin. Capturing, copying and saving never need an account; a free Google sign-in is optional (see SIGN IN WITH GOOGLE). To keep a capture off LilLabr’s servers, turn Save captures Off in Settings before you capture. Figma, saved-file sharing and clipboard history or sync have their own data handling. KNOW THE LIMITS Supported text, images, vectors, fills and layout become editable; complex pages may need cleanup. Missing fonts, blocked resources and inaccessible embedded content can affect the result. HTML-to-Figma work starts from the rendered webpage in Chrome. THE PANEL Click the toolbar icon to open the LilLabr panel in Chrome’s side panel, beside the page (the page gets narrower; nothing is drawn over it). The panel belongs to the tab you open it on and works on that tab only: another tab has no LilLabr panel unless you open one there, and the panel is shown again when you come back to its tab. Click the icon again on that tab, or Chrome’s own close button, to close it; closing the tab closes it too. Its tabs are Capture and Recent. On Capture, Capture full page captures the loaded page, and the two small buttons next to it capture what is on screen or one element you pick; after a capture, a line under them says it is done and how to paste it into Figma (⌘V or Ctrl+V). Latest capture shows your last capture with Copy to Figma, Download capture (a .labr file) and whether it was saved; completed downloads, clipboard copying and saving have separate outcomes. Press a capture’s thumbnail to see a picture of the capture, drawn from the capture itself. While your flow has pages, a bar under Latest capture shows them, with New flow to start another. Until setup is done, Capture ends with Finish setup: connecting Figma and, until you have, signing in with Google, with a count of the steps done. Then it says You’re all set, with Open Figma and, once you are signed in, Connect MCP tools. AI connection options appear only once you are signed in with Google. Recent lists the pages saved in your current flow; you can remove a page (after a confirmation it is deleted from your saved captures), download all of them as one .labr file, or start a new flow. The foot of the panel has Contact (the support page) and Settings (your account, the Figma connection, Save captures, and the AI links once you set one up). Chrome’s own pages and the Chrome Web Store cannot be captured, and the panel says so. The panel also offers a 15-minute demo with the developer: Book a 15-min demo opens Google Calendar’s booking page in a dialog in the panel, loaded only when you press it, with Open in a new tab. LilLabr sends nothing when the banner is shown or used, and Google’s privacy policy applies to its page. The banner’s × hides it until you open the panel again. A short welcome runs once after you install LilLabr: agree to the Privacy Policy and Terms, capture a page, paste it into Figma, answer up to three quick questions if LilLabr is collecting feedback (or skip them) and, if Google sign-in is available, sign in, which you can skip with Not now. It appears on lillabr.com and in the panel. Updates never repeat it. SAVED CAPTURES AND LOCAL HANDOFFS Your first capture waits for a box: "I agree to the Privacy Policy and Terms" (Capture full page stays grey until you tick it). Its popup says what a capture holds and that each capture you make is saved on LilLabr’s servers for 7 days so the Figma plugin can import it. A saved capture is the complete .labr archive and a thumbnail, which can contain page content, images, visible form values and the page address. The service operator can read them; LilLabr does not provide end-to-end encryption. A second box, unticked, asks whether you want product news by email; nothing depends on it. In a new installation, agreeing turns Save captures On for future captures. An update keeps the choice you had, and an existing Off choice stays Off. Agreeing does not register a workspace or upload earlier captures. Turn Save captures Off in Settings before capturing a page you do not want saved; captures then stay on this computer. Download capture and direct paste remain available as local handoffs. The Figma card (in Finish setup, and in Settings, where Manage offers a new code once Figma is connected) makes a one-time pairing code when you ask for one (eight characters, with a ten-minute countdown) that you paste into the companion LilLabr Figma plugin; making a code while Save captures is Off keeps it Off. While the code is shown, the panel asks LilLabr’s servers whether the plugin has taken it and says Connected by itself (where the servers cannot tell, it asks you to confirm). With Save captures On your captures are saved by themselves; Send latest capture saves one that was not saved yet (for example one made while Save captures was Off), and while Save captures is Off it asks you to turn it on first. Start new flow in Recent, or New flow on the Capture tab, starts a separate flow without deleting the old one. SIGN IN WITH GOOGLE (OPTIONAL) Signing in with your Google account is optional and free, and capturing never needs it. You can sign in from the welcome steps, from Finish setup on the Capture tab or from Settings > Account. Setting up the live assistant connection (see AI ASSISTANTS) needs this sign-in. If LilLabr's sign-in service is switched off or cannot be reached for 24 hours, no sign-in is offered. Signing in links the workspace of your saved captures to your account, so another browser, or a reinstall, can get that workspace back. Captures still expire after seven days. Signing out keeps Save captures and your Figma connection as they are. Manage your saved captures at https://app.lillabr.com/. Continue with Google to use the same account and owned workspace as Chrome. Compatible Chrome can connect that account through a one-use handoff. This keeps capture consent, Save captures and Figma setup as they are; a different account is not silently substituted. LilLabr stores your Google account ID, email address and name, and your product-news choice. It never receives your Google password. It uses your email to run your account and your saved captures and to email you about your account and LilLabr. Product news is sent only if you ticked its box on the capture step (it starts unticked; your answer goes with your first sign-in), and every such email has an unsubscribe link. LilLabr does not sell your email or use it for advertising. To delete your account, email support. AI ASSISTANTS (OPTIONAL) Saved references: the separate assistant app is under review and not yet publicly available; use the saved-reference integration only when available in your account. Connect Lil Labr through its OAuth consent to read a saved capture or ordered flow. Library browsing needs its own permission so you can browse preview cards and choose references. Once captures are saved, reading them needs no open Chrome, Figma installation or fresh capture. Lil Labr supplies saved previews, measured layer, font and color information, available assets and the original .labr archive. Creative generation and changes in Figma use separate connected tools. Live Chrome captures: an AI app you connect can ask LilLabr to capture pages and read them. The connector link and the local link are off until you set them up, and each website needs your Allow in a LilLabr window first. • Live Chrome connector link: compatible apps that support a remote MCP connection can use a private link you create in the panel (after the free Google sign-in: use Set up on the Capture tab, or Connect MCP tools once setup is done). Chrome must be open. Because the link is a web address rather than a program on your computer, each capture passes through LilLabr’s servers, encrypted with a key from your link, and expires an hour after the app last reads it (a day at most). The developer operates that service and could read captures while they exist. While Save captures is on, each capture is also saved like one you make yourself, so you can import it with the Figma plugin; that copy is kept as saved captures are and is not encrypted with your link’s key. Anyone with your link can ask for captures, and each website still needs your Allow, so treat the link like a password. Pause, Reset link and Turn off are in Settings while you have a link. • Local link: compatible apps that can run a local MCP server can use lillabr-mcp, a small program you install on your own computer. Captures stay on your computer, and LilLabr uploads nothing for it. • Browser agents: while a LilLabr panel is open on any tab, an AI agent in your browser that supports WebMCP (not in Stable Chrome by default) can start a capture and save the file to Downloads. This is on by default; closing every LilLabr panel turns it off. Pages can contain text meant to mislead an AI app. LilLabr marks page text as untrusted and asks before each website, but cannot control what an app does with a capture. PRIVACY AND LIMITS LilLabr uses website access when you request a capture to read the selected page and readable embedded frames and retrieve declared images, icons, backgrounds and fonts. Passwords and identified card fields are masked in editable scene data and direct paste. Populated text inputs, textareas and selects inside embedded frames are also masked. The thumbnail and the picture of a capture are drawn from the capture itself, so those fields are masked in them too; unmarked top-level card fields may be captured. Capture is not a complete redaction system. Vercel hosts LilLabr's website, dashboard and first-party API/MCP request routing; Supabase provides backend functions, database and storage. Depending on the feature used, these providers process capture and account requests as described in the privacy policy. To turn text into native Figma text, a capture also downloads the matching open-source font files from Fontsource copies on cdn.jsdelivr.net, even with Save captures Off. The address carries only a font family, weight and italic, never the page's address or content. The latest local capture can remain in extension storage for up to 24 hours for Copy or Save retry; Forget latest capture in Settings removes it sooner. A picture of each of your 24 most recent captures, with its title and address and the details a report about it would use, is shown for up to 7 days (a day for a capture made in Incognito) and deleted from extension storage at your next capture after that; Forget latest capture also removes the latest one’s. The system clipboard and its history or sync can retain a copied payload. Saved captures expire after seven days and are removed on a later sync request; the service keeps the newest 50 per workspace. Turning Save captures Off or clearing a connection does not delete saved copies. Delete or Delete flow in the paired plugin, and Remove in the panel’s Recent tab, remove saved copies after confirmation; saved files and imported Figma layers remain separate. Blocked assets and unavailable fonts may prevent a complete import. Chrome system pages and the Chrome Web Store cannot be captured. USAGE ANALYTICS Usage analytics is on by default; Chrome and the Figma plugin have no switch for it. In a new Chrome installation it starts when you agree to the Privacy Policy and Terms, and nothing is sent before that. An update keeps the choice you had, so analytics that was off stays off; the plugin also stays off if you turned it off in an earlier version. It sends limited LilLabr feature actions, outcomes, counts and durations with a random ID to PostHog US Cloud. Captured content, page URLs, titles, pairing codes and tokens are excluded. There is no session recording or automatic browsing tracking. To object, email support (the privacy policy has the address). It is separate from Save captures. FEEDBACK (OPTIONAL) After your first capture and paste, LilLabr may ask three quick questions: a score from 1 to 5 for each and, below 5, a few words. They appear only while LilLabr is collecting feedback. Skip feedback sends nothing. Answers go to LilLabr’s own server with the version and where you answered, never with your account, email address or a capture, and are kept 12 months. In Chrome, three scores of 5 are followed by a request for a store review (see OPTIONAL REVIEW REQUESTS). CAPTURE REPORTS (OPTIONAL) If something on a page did not come through, Something didn’t come through? under Latest capture opens a short report: what is missing, an optional note (email addresses, web addresses and long numbers are taken out of it) and whether to include the page’s address without anything after ? or # (ticked to start with). Under What we send, the panel shows the exact report before anything is sent. Besides your answers it holds versions, and counts, codes, font names and other websites’ host names about the capture, never page text, the page title, form values, images, cookies or an account or device id. Send report sends it to LilLabr’s own server, which keeps it 90 days with no account, device or IP address. While LilLabr is not taking reports, you can download the report and email it instead. OPTIONAL REVIEW REQUESTS In Chrome, the feedback questions after your first capture (see FEEDBACK) are followed by a request for a Chrome Web Store review only if you give all three a 5; any lower score gets a thank-you and no request. That request is the one otherwise shown at five captures, so your answer there counts for it. Apart from it, Chrome review controls appear after five successful usable captures; the Figma plugin separately counts successful supported .labr file imports. Automatic requests wait until idle at 5, 15, 30, 50 and 100 successes, the same for everyone. Not now waits until the next milestone (in the Figma plugin, Later also waits 30 days); after 100 it stops automatic requests. In Chrome the voluntary review link in Settings stays available after five; the Figma plugin asks only with its card at the milestones. Opening the official listing suppresses automatic requests for 90 days. LilLabr does not observe whether you posted a store review. LilLabr has no advertising. Read the full privacy policy at https://lillabr.com/privacy/ and the terms at https://lillabr.com/terms/, and get help at https://lillabr.com/support/.