Tools / Motion background maker
Free tool

Free Motion Background Maker

Make a motion background for your website right here in the browser — scrub the live demo, upload your own clip, restyle it and copy the embed code. Free, no signup.

Make a motion background →Browse ready-made backgrounds

The maker

The preview below is a real motion background, rendered by the same engine as a published Scrollytelling story. Pick a mode, edit the heading and colors, upload your own clip — then copy the embed code or download a self-contained HTML file.

Scroll-scrub ties the footage to the reader's scroll; Autoplay loops on its own. Uploading your own clip works in Scroll-scrub mode — in Autoplay mode you can paste any video URL.

your-site.com
Customize & export

Rendered by the same engine as a published story. Scroll-driven widgets scroll inside the frame.

549 motion backgrounds made in the last 30 days · 325 creators · median 41.5 s from prompt to motion

Three ways to start

No signup wall, no gradient-only presets — the tool is the page. Prefer a walkthrough first? Read the step-by-step guide.

1. Upload your own clip

Drop any video into the maker above (Scroll-scrub mode) and we convert it into scroll-ready frames automatically — usually well under a minute. Limits: max 100 MB video, first 100 seconds used, capped at 350 scroll frames. Then copy the embed code or download the HTML — done.

Upload above ↑

2. Remix a ready-made background

Prefer to start from something finished? Browse real AI-made motion backgrounds — dark volumetric drifts, product studios, slow dolly-ins — and remix one for your site.

Browse motion backgrounds →

3. Generate with AI in the editor

Describe a scene and the editor generates a still, then animates it into a motion background. Honest print: AI generation uses credits. It's also fast and reliable — in the last 30 days on Scrollytelling, median 41.5 s, p90 72.4 s prompt-to-motion, and the video step succeeded first-attempt 549/549 times (99.3% of stills rendered first-attempt too).

Open the editor →What 549 real prompts look like →
The Scrollytelling editor with a story open and the hero motion background selected, showing the Customize panel
What “Open in editor” unlocks: the hero motion background selected in the Scrollytelling editor, with the Customize panel open.

Why the embed stays fast

Most video backgrounds ship as a heavyweight autoplay MP4 that competes with your page for bandwidth. Ours don't. On Scrollytelling, a motion background is built like this: a still image becomes a 20-second image-to-video clip, then ffmpeg splits it into up to 350 WebP frames (quality 90, max width 1200 px) hosted on a CDN — and the page scrubs those frames as the reader scrolls. Nothing plays until the reader moves, scrubbing works forward and backward, and frames load progressively instead of buffering a video stream.

This maker is powered by the same two widgets you can use anywhere: scroll video (scrub mode) and video background (autoplay mode) — see all widgets.

Where a motion background earns its keep

Website hero

Open with slow, cinematic motion under your headline instead of a static image — the single highest-impact spot on any site.

Scroll video widget →

Landing page

A drifting background keeps a one-message page alive while the copy does the selling.

Free brand story maker →

Shopify product page

Put the product in slow motion — studio light, subtle drift — instead of a flat packshot.

Product feature templates →

Event page

Set the mood before a single word is read — a night-sky drift for a launch, warm bokeh for a festival.

Event promo templates →

Portfolio

A restrained, dark motion background signals craft without upstaging the work itself.

About-me templates →

Presentation opener

Start a scroll-told one-pager or pitch with motion, then let the sections take over.

One-pager templates →

How it works

Pick or upload

Start from the live demo, remix a ready-made background, or upload your own clip.

Customize

Set the heading, accent, background and text colors — the preview updates live.

Copy the embed code

Or download a self-contained HTML file. Paste it into any site — no account needed.

Open in the editor

Optional: build a full scroll story around your background and publish it to a link or your own domain.

Related free tools

More from the motion-backgrounds series, and a few sibling makers — every one is free.

Motion backgrounds gallery →How to make a motion background →Compare every free tool →Free timeline maker →Free data story maker →Free digital magazine maker →Browse all templates →

Frequently asked questions

Is the motion background maker really free?

Yes. Customizing a background, uploading your own clip and exporting the embed code or HTML file are free. Generating brand-new AI motion backgrounds happens inside the editor and uses credits on a free or paid plan.

Do I need an account?

Not for the maker on this page — customize, upload and export with no signup. You only create a free account if you open your background in the editor to build a full story around it.

What video formats and sizes can I upload?

Any common video format — a short MP4 works best. Uploads are capped at max 100 MB video, the first 100 seconds are used, and the clip is converted into at most 350 scroll frames (a full 100 s upload is sampled at 3.5 fps).

Can I export an MP4 or GIF?

No — this maker exports a copy-paste embed code or a self-contained HTML file, because the output is a web background, not a video file. If you want a whole page built around it, open it in the editor and publish a story. We don't render MP4 or GIF downloads.

Will a motion background slow my website down?

Not the way we build it. Instead of shipping a heavyweight autoplay MP4, Scrollytelling converts the clip into up to 350 WebP frames (quality 90, max width 1200 px) served from a CDN and scrubbed on scroll — so nothing plays until the reader moves, and the page stays responsive.

What's the difference between scroll-scrub and autoplay?

Scroll-scrub ties the footage to the reader's scroll position — frames advance only as they scroll, forward or back. Autoplay is a classic looping video background that plays on its own. The maker above does both; use the toggle to compare.

Can I use what I make commercially?

Yes — embed your background on commercial sites, client work and product pages. For uploads, use footage you have the rights to; AI backgrounds generated in the editor are yours to use under your plan.

How fast is AI generation?

In the last 30 days on Scrollytelling, making one AI motion background (still image + image-to-video) took a median 41.5 s, p90 72.4 s, from prompt to motion. The video step succeeded first-attempt 549/549 times.

Make your motion background now

Customize and embed one free above — or open the editor and build a whole scroll story around it.

Create your story →