Record a 30-second video with SWR.
Open the engine, drop in a song, press record. That's the whole thing — no install, no account. Tick each step off as you go.
Give the tab a moment
Keep the engine tab focused. Chrome or Safari, on a screen at least 1080 px wide.
Load a song
Click LOAD SONG and pick any audio file — MP3, WAV, M4A or FLAC.
Wait for READY
The pill in the top bar turns green once the engine has finished scanning. First run takes 5–10 seconds.
Press ▶ PLAY
The visuals react to the track — clips scale, shift and slide with the music.
Pick a length
The dropdown next to the record button. 30s is the default.
| Length | Good for |
|---|---|
| 10s | Short reel |
| 15s | Instagram Reel |
| 30s | Reel, YouTube Short, 30s ad |
| 60s | One-minute loop |
| song | As long as the track |
Press ● REC
The button turns red and the pill counts down.
Let it finish
It stops on its own at the length you picked. You can also press ■ STOP early for a shorter clip.
Find the file
It saves itself to your downloads folder as sainted-word-….mp4. A 30-second clip is around 4 MB.
Done — that's a music video
Real MP4, 1080p, 30 fps. Opens in any editor: Premiere, DaVinci, Final Cut, QuickTime. Uploads straight to YouTube, TikTok or Instagram.
Technical reference
Everything below is optional. Skim it if you hit a problem; ignore it if you don't.
Running it yourself instead of using this site
The engine is MIT-licensed and runs from a clone. From the project root:
# from the project root $ git clone https://github.com/kajica2/sainted-word-records.git && cd sainted-word-records $ npm install $ npx vite --port 5174 --host 0.0.0.0 ✓ Vite ready · http://localhost:5174/
Building for a server is npx vite build — the static bundle lands in dist/.
How the recording works
The whole pipeline is in the browser. Four boxes, three arrows, one MP4.
It asks for H.264 MP4 first and falls back to WebM if the browser can't do MP4. Chrome 126+ and Safari 14.5+ all give MP4 natively.
const mime = [ 'video/mp4;codecs=avc1.42E01E,mp4a.40.2', // H.264 baseline + AAC LC 'video/mp4;codecs=avc1,mp4a.40.2', 'video/mp4', 'video/webm;codecs=vp9,opus', 'video/webm', ].find(m => MediaRecorder.isTypeSupported(m)) || 'video/webm';
The five visual versions
Top-left badge on the engine: 5 visual versions →. Same engine, different blend / blur / grain treatment.
| Version | Looks like | Best for |
|---|---|---|
| NEON | Electric magenta / cyan | Synthwave, club |
| FILM | Sepia, 16mm grain, soft vignette | Folk, soul, lo-fi |
| GRID | Monochrome, hard cells, snap-to-beat | Techno, industrial |
| SMOKE | Cream warm, heavy blur | Ambient, drone, slowcore |
| HALLUCINATION | RGB shift, scanlines, noise | Psych, noise |
Reading the engine's state from a console
If a step looks stuck, open the engine console and write a snapshot to localStorage['swr-debug']. The Live engine panel above will then pick it up.
localStorage.setItem('swr-debug', JSON.stringify({
lib: Lib.items.length,
audio: !!Audio.audioEl,
layers: Layers.list.length
}));
Want scene-by-scene control instead of audio reactivity?
SWR drives the visuals from the audio. If you'd rather plan every second by hand, the hyperframes skill is the right tool — multi-phase scene blueprints, GSAP / CSS / Anime.js keyframes, offline rendering via Remotion.
What ships in the engine right now
| main / | NEON | FILM | GRID | SMOKE | HALLUC. | |
|---|---|---|---|---|---|---|
| 30s auto-stop | ✓ default | ✓ | ✓ | ✓ | ✓ | ✓ |
| MP4 export | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ |
| Fresh remap each click | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ |
| 27-item library | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ |
| window.SWR exposed | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ |