All posts
TutorialsSoraiaOct 26, 20266 min read

Free n8n Templates for Websites: 14 Workflow Examples

14 free n8n workflow templates for designers, agencies and developers: download every image, rebuild a page in Elementor or Shopify, get a brand kit, and an AI agent that rebuilds websites.

The n8n template library is full of social media posters, lead scrapers and support bots. Templates that work on the design of a website (its code, its sections, its brand, its images) are rare. These 14 are free, each one runs on a real website end to end, and each has its own page with the workflow and an import link.

All of them use the MiroMiro node. Get a free API key (300 credits a month, no card) and install the node from Settings > Community nodes with the package name n8n-nodes-miromiro.

Images and files

Download every image from a website. MiroMiro lists every image on the page (img tags, srcset, CSS backgrounds, favicons, og:image), n8n downloads each one and zips them. 1 credit per page, however many images. Turn on Render for images that only load when you scroll.

Website to code

Rebuild a whole page as code. Every section of a page as Tailwind, React, HTML or Vue, one file per section in a zip, plus a link to the whole page assembled with a Download HTML button. This is the template I would start with if you build websites.

Rebuild any website from a form. Same job behind an n8n form: paste a URL, pick the output, and the browser opens the rebuilt page. Good as an internal tool for a team that does not use n8n.

Migrate a site to Next.js. List the pages of a WordPress, Elementor, Shopify or Webflow site with the route each should become; get a Next.js + Tailwind project as a zip. Menus, sliders and forms arrive as static markup, so plan an afternoon to wire them up.

WordPress and Elementor

Rebuild a whole page in Elementor. Every section of a page joined, in order, into one Elementor page template you import into WordPress. Each section arrives as an Elementor container with its styled HTML inside, so it looks like the original as soon as you import it.

Turn website sections into Elementor templates. One section, or a list of pages and sections in one run, each as its own importable .json. The bulk version is the one agencies use to build a library of section templates.

Shopify

Rebuild a whole page as Shopify sections. Every section as an Online Store 2.0 section (.liquid), zipped for Edit code > sections.

Upload a section to your Shopify theme. Extracts one section and pushes it straight into your theme through the Shopify Admin API. Test it on an unpublished theme copy first.

Brand and design research

Get any website's brand kit as files. A zip with the logo, brand.css (colors and fonts as CSS variables), tokens.json (W3C Design Tokens for Figma or Style Dictionary) and a readable summary. 20 credits per site.

Compare the brands of many websites. A list of websites in, one CSV out: primary and accent colors, fonts, logo and confidence per site. Useful for competitor research and agency pitches.

Brand board from any website. Open your webhook with ?url=stripe.com and get a designed brand board in the browser. The fastest one to show to a client.

AI agents

An AI agent that rebuilds websites. A chat agent with MiroMiro as its tools: "turn the hero of linear.app into a React component", "what are airbnb.com's brand colors?". Works with Claude, OpenAI, Gemini or any chat model with tool calling.

All of them at once

The starter workflow. Four of the above on one canvas (images, a section in Elementor, a whole page as code, the agent) to see what the node does before picking a focused template.

What they cost

TemplateCredits
Download every image1 per page
A section as code, Elementor or Shopify10 per section
A whole page (6 to 12 sections)60 to 120
Brand kit as files20 per site
Compare brands, brand board10 per site

The same page with the same settings within 24 hours is free, so re-running a template while you adjust it costs nothing.

How to import one

  1. Open the template's page and click Copy link.
  2. In n8n, open the ⋯ menu at the top right of a workflow and choose Import from URL.
  3. Open any MiroMiro node, create the credential with your API key.
  4. Change the website in Settings and click Execute workflow.

Browse all of them, with the workflow drawn and the result shown, at miromiro.app/api/n8n. You can start for free.

Skip the maintenance - one API call

Design tokens, brand data, fonts, SVGs, images, and section code from any URL. 300 free credits a month, no card.

S

Soraia · Founder, MiroMiro

Building MiroMiro: a browser extension and API that extract design tokens, assets, and production-ready code from any live website. The gotchas in these posts come from the extraction engine's own commit history.

Follow on X
n8nn8n templatesautomationelementorshopify