GOAT SaleLifetime $349 $174.50 · Yearly 25% offleft

India price: 40% off any design withapplied for you at checkout

← Back to store
studio sitewebgl / shadershtml/css/js

BrandMotion — Brands That Move People

One particle field, five shapes, no images at all

Our own studio site, and the smallest thing in the store by a wide margin: five files and 48KB of source, with no images, no video and no build step. A single GPU particle field of roughly 65,000 points is the entire visual identity, morphing through five shapes as you scroll — a wavy torus ring, a double helix, a flowing terrain wave, a gravity well and an orbital galaxy — and between each stage the points burst into a dust cloud and reform, driven by the fractional part of one uniform in the vertex shader. Every shape is computed on the GPU rather than loaded, which is why a site this dense weighs almost nothing.

Paste the prompt intoClaude CodeCursorAntigravityWindsurfLovableBoltv0

What's in the source

6 files — one self-contained page that opens in a browser, with the prompt that made it.

brandmotion-particles/
├─ js/  2 files
├─ css/  1 file
├─ README.md
├─ index.html
└─ … 1 more

How to run this

Works the same on Windows, macOS and Linux. No prior setup beyond Node.js, and nothing to configure — the pack runs as-is.

Built with
Static HTML/CSS/JS
Requires
Node.js 18 or newer
Opens at
http://localhost:3000

Note — Needs a local server — the page loads data with fetch(), which browsers block on file:// URLs. Opening index.html directly will not work.

✦ Or let an AI agent set it up for you

Already using Claude Code, Antigravity, Cursor or Windsurf? Unzip the pack, open the folder as a project, and just ask:

Install the dependencies and run this project, then give me the URL

It reads the README included in the pack, runs the right commands for this project, and sorts out anything that trips along the way. You still need Node.js installed (step 1 below) — everything after that it can handle.

Or run it yourself

  1. 1

    Install Node.js, if you don't have it

    Download the LTS build from nodejs.org and run the installer — on Windows and Mac it handles everything. Mac users with Homebrew can run brew install node instead.

    To check it worked, run node --version. It should print a number like v22.11.0.

  2. 2

    Unzip the pack, then open a terminal inside the folder

    Windows: open the unzipped folder in File Explorer, click the address bar, type powershell and press Enter.

    Mac: press Cmd+Space, type terminal, press Enter. Then type cd (with a trailing space) and drag the unzipped folder onto the terminal window — it fills in the path for you. Press Enter.

  3. 3

    Start it

    Run npx serve . — npx downloads the little server on demand, so there is nothing to install first.

    Then open http://localhost:3000 in your browser. Leave the terminal open while you use it — closing it stops the site. Press Ctrl+C in the terminal to stop.

+ If something goes wrong
“npm is not recognised” / “command not found: npm”
Node.js isn’t installed, or the terminal was open before you installed it. Close the terminal, open a new one, and try again.
“Port 3000 is already in use”
Something else is running there — often a previous copy of this site. Close the other terminal, or stop it with Ctrl+C.
The page loads but images or video are missing
Make sure you ran the command from inside the unzipped BrandMotion — Brands That Move People folder itself, not the folder containing it.

Still stuck? Email us and we'll get it running with you.

Questions about BrandMotion

Who is BrandMotion for?

BrandMotion is for creative studios, and for the designers, developers and agencies who build their sites. It's a foundation rather than a site for one business: ask your AI to make it about yours and it rewrites the copy, colours and images around the same build.

What is BrandMotion built with?

BrandMotion is built with WebGL / Shaders and HTML/CSS/JS. The source is a single HTML file: open it in a browser and it runs, with no build step.

Can I use BrandMotion for a client project?

Yes. Every purchase includes a commercial licence: use it in your own projects and in work you deliver to clients, including paid client work, change and rebrand it, and publish the result with no credit needed. What you can't do is resell, share or republish the prompt or the source files themselves.

Can I get a refund?

Single designs are final once delivered, unless something is wrong on our side: a broken or empty download, a pack that isn't what its page describes, or a double charge. Then email support@brandmotion.in with your receipt and we fix it or refund it. The full terms are on the refunds page.