Beamish

How it works

There is no package to install and no CLI to run. You copy a prompt and your agent does the work.

  1. Step 01

    Pick an effect

    Every item has a video, a live demo you can interact with, and a full table of its options. There are 13 of them.

  2. Step 02

    Press Copy prompt

    You get roughly 10KB of instructions: two source URLs to fetch, every option with its default and the range that actually looks good, wiring for React, Vue and plain HTML, cleanup and SSR notes, and the three mistakes most likely to be made with that particular effect.

    If your agent cannot reach the web, the second button gives the same instructions with the source pasted in.

  3. Step 03

    Paste it into your agent

    Claude Code, Cursor, Copilot, Windsurf, or anything else that can read a file and write one. It fetches the source, puts it where your project keeps things, and wires it up to whatever framework you are already using.

Why a prompt and not a package

A component library has to guess your build, your framework and your styling system. It will be wrong about at least one of them, and you spend the afternoon fighting it.

A prompt does not guess. It hands your agent the real source and lets the agent adapt it to the project in front of it. Change the file afterwards as much as you like. It is your code, in your repo, with no dependency to update.

Prompt URLs pin to a git tag, currently v0.2.0, and never to main. A prompt you paste today still fetches the same file in a year.

What you get

Two files, usually. The effect itself, and a shared runtime that handles the parts everyone gets wrong: capping device pixel ratio, pausing when the element scrolls offscreen or the tab is hidden, watching prefers-reduced-motion live, recovering from WebGL context loss, and cleaning up completely on unmount.

Every ambient effect can be paused, because WCAG 2.2.2 is Level A and it covers anything that moves on its own for more than five seconds. Nothing flashes more than three times a second. Everything degrades to a still frame under reduced motion rather than to nothing.

All of it is MIT. Use it in commercial work with no strings.

The name

Beamish is a real English adjective meaning shining brightly, first recorded in 1530. It is also my surname.