Use the Chrome extension
Add the SketchXFlow extension to Chrome, connect your account, then open any site to read its design, copy it, rebuild it or audit it.
Checked against the product on
Install it and connect your account
- Open SketchXFlow on the Chrome Web Store and press "Add to Chrome". It works in Chrome on a computer, not on a phone.
- Chrome may ask you to confirm the install. Press "Continue to install" and the extension is added.
- Click the puzzle icon at the top right of Chrome and pin SketchXFlow, so its icon stays in the toolbar.
- Click the SketchXFlow icon. A panel opens at the side of the page.
- Press "Sign in" in the panel. A SketchXFlow page opens: sign in or create an account there, then press "Connect".
Reading a page works without an account. Sending anything to SketchXFlow needs one.
Rebuild a site you like
This is the closest match you can get to another site. The extension reads the page in your own browser, as you see it, so a page drawn in 3D or played by scrolling comes across too.
- Open the site in Chrome and wait for it to finish loading.
- Click the SketchXFlow icon and open the "Recreate" tab.
- Under "Rebuild it as a clean design", add anything you want changed, then tick the box to confirm the page is yours or you may copy it.
- Press "Rebuild in SketchXFlow". Keep the tab open while it reads the page; on a 3D site it scrolls the page for you.
- Press "Watch it in SketchXFlow". The design opens in the editor when it is ready, a few minutes later.
Rebuild needs a paid plan and uses coins like any design. See coins, costs and plans.
| Action | Coins |
|---|---|
| Website design | 12 |
The rebuild follows the look, layout and motion. Another company's logo, 3D models and photos stay theirs: use your own in your design.
Copy a page as it is
In the "Recreate" tab, "Copy into SketchXFlow" saves the page exactly as you see it as a new design. It is free. Scripts and forms don't come along, and 3D scenes come as pictures.
What each tab does
| Tab | What you get |
|---|---|
| Style | The page's colours, fonts, text sizes, corners, spacing and shadows. Copy them as CSS or start a design from them. |
| Structure | A design-system check with a grade and fixes, plus the page's headings and landmarks. |
| Code | The tech the site is built with, the API calls it makes and basic security checks. |
| Components | Navigation, sections, cards, forms and buttons as pictures. Copy one and paste it into Figma, or save it as SVG, PNG or HTML. |
| Assets | Every image and link on the page, and a check for broken links. |
| Recreate | Copy the page as it is, or rebuild it as a clean design. |
| Audit | A quick UI/UX check in the browser, and the full site audit with its certificate. |
| Projects | Your recent SketchXFlow projects. |
If something doesn't work
- The panel shows nothing: reload the page, then click the SketchXFlow icon again.
- It asks for access to the site: allow it. The extension only reads the page you have open.
- A page on your own computer (localhost) can be read and copied, but Rebuild and the full audit need the live site.
- Still stuck? Contact support.
Questions
- How do I make a site like one I've seen?
- Add the SketchXFlow Chrome extension, open that site, and choose Recreate, then Rebuild in SketchXFlow. It reads the page in your own browser, 3D and scrolling included. You can also paste the link in the box on the home page and press Generate.
- Why does Chrome ask me to confirm before adding the extension?
- With Enhanced Safe Browsing turned on, Chrome asks you to confirm extensions from publishers that are new to the Chrome Web Store. Press Continue to install and the extension is added.
- Is the Chrome extension free?
- Installing it, reading a page and copying a page as it is are free. Rebuilding a page as a clean design needs a paid plan and uses coins like any design.
Related
- Make your first designDescribe what you want in the box on the home page, pick Website or Mobile app, and press Generate. The editor opens with your design.
- The free site audit and reportPaste a URL on the audit page for a free one-page UI/UX audit: a score out of 100, every issue with a fix, and a certificate you can share.
- Coins, costs and plansCoins pay for AI work. A standard website design reserves 12 coins and an AI edit 3. Free is a one-time 60 coins; paid plans refill monthly.