Select it on the page
Open PocketUI on any website and drag over the section you want.
Webflow export · coming soon
Website to Webflow convert any HTML section into native Webflow elements
Select any section on any website. Paste it into the Webflow Designer with its classes and breakpoints intact.
Early supporters get 30% off their first year. No spam, ever.
Webflow demo video · coming soon
How it works
Three steps from a website to Webflow
Captured1 / 5
HTML structure
PocketUI captures the real thing
Not a screenshot: its structure, authored CSS, states and breakpoints, saved to your library.
CtrlV
Paste it into Webflow
Copy for Webflow, paste in the Designer. Elements, classes and breakpoints come with it.
Steps 1 and 2 work today. The Webflow step is coming soon.
Webflow
What lands in Webflow
Capture
From any live website
No rebuilding by hand. Select the section on the page and it heads straight for the Designer.
Section captured
What lands
Real elements with real classes
Sections, grids and buttons land in the Navigator with named classes, not one embed.
Navigator1 / 6
Section· Pricing
Responsive
Responsive, already set
Desktop, tablet and mobile styles come from the site's own CSS.
Library
Every capture, kept
It is also saved to your library, in a folder you name by idea, so you can find it again.
Image
Tailwind
Figma
Palette
Screenshot
Image
Tailwind
Figma
Palette
Screenshot
React
Image
Font
Aa
HTML
Image
React
Image
Font
Aa
HTML
Image
SVG
Vue
Palette
Page
Image
SVG
Vue
Palette
Page
Image
Every export
One capture, every platform
Capture a section once and send it wherever the project lives. Each export has its own page.
Convert a website to Webflow, in short
PocketUI is a design inspiration tool and Chrome extension that saves any section of a live website as real code. Its Webflow export, coming soon, will turn that saved section into native Webflow elements with classes and breakpoints, so you paste it onto the Designer canvas and restyle it from the Style panel instead of rebuilding it or using an HTML embed.
Webflow export questions
Yes. You select the section on the live website, copy it for Webflow, and paste it on the Designer canvas.
No. It arrives as native Webflow elements with classes, so you can restyle every part from the Style panel.
Yes. The original media queries are mapped to Webflow breakpoints for each class.
Open PocketUI on the page, select the section you want, choose Webflow as the export, and paste it onto the Webflow Designer canvas. It arrives as native elements with classes.
Webflow has no HTML import of its own. PocketUI reads a section's real HTML and CSS and converts them into Webflow's elements, classes and breakpoints, which you paste in.
Yes, when the design already exists as a live website. There is no Figma file in between. PocketUI also exports to Figma if you want a design file too.
Use it to learn from layouts and to move your own or your clients' designs into Webflow. Text, images, logos and brand assets on other people's sites stay their property, so replace them with your own.
Webflow export is coming soon, on the Studio plan or the Webflow pack. Figma and code export already work on every plan.
Stop recreating designs you've already seen
Join now and get 30% off your first year as an early supporter.
One email on launch day. That's it.