HyperFrames · Background
aurora-drift
Three soft accent-derived aurora fields drift in an exact ambient loop over a deep base and faint vignette.
npx hyperframes add aurora-drift1,516 open-source blocks, ready to install
Captions, transitions, text animations, effects and layouts published by HyperFrames, Remotion, gl-transitions, Editframe, Motion Canvas and their communities. Each links to its source and shows its license; check it before you ship.
HyperFrames · Background
beat-pulse-background
An accent-derived backdrop pulses its glow intensity and saturation on a deterministic, supplied beat grid.
npx hyperframes add beat-pulse-backgroundHyperFrames · Background
cosmic-orb
An iridescent soap-bubble planet: a slowly spinning sphere of nebula bands, dust lanes and twinkling stars wrapped in a refracting glass limb with chromatic aberration a…
npx hyperframes add cosmic-orbHyperFrames · Background
dynamic-grid
A responsive animated grid background driven by CSS variables for SaaS, code, and data scenes
npx hyperframes add dynamic-gridApache-2.0Code ↗
HyperFrames · Background
gallery-tunnel
An infinite corridor of panels: a square tunnel receding to a vanishing point, its floor, ceiling and walls tiled with saturated colour slabs and caller-supplied images…
npx hyperframes add gallery-tunnelHyperFrames · Background
grain-field
A clearly visible accent-tinted dot field drifts over a subtle luminance gradient in an exact ambient loop.
npx hyperframes add grain-fieldHyperFrames · Background
halftone-field
A full-bleed halftone light field: a grid of dots whose size and colour track a slow flowing simplex-noise field, so broad bands of light sweep across a mostly-black fra…
npx hyperframes add halftone-fieldHyperFrames · Background
mk-background
Procedural soft-blob gradient backdrop in a minimalist presentation style: two radial blobs drifting over a base color, with an animatable rounded-card bar mask and opti…
npx hyperframes add mk-backgroundHyperFrames · Background
spiral-galaxy
A spiral galaxy seen from outside, turning with real differential rotation: inner stars orbit faster than outer ones, so the arms wind up over the shot instead of spinni…
npx hyperframes add spiral-galaxyHyperFrames · Background
vfx-anamorphic-flare
A drifting field of bright points, each one throwing the long horizontal blue-violet streak a real anamorphic cinema lens produces.
npx hyperframes add vfx-anamorphic-flareHyperFrames · Background
vfx-liquid-background
Organic liquid simulation with vertex displacement on a subdivided plane.
npx hyperframes add vfx-liquid-backgroundHyperFrames · Background
yt-lcd-background
Textured paper board: scanlines with slow drift, optional pixel grid, static grain, and display text with a blur-focus entrance and chromatic-fringe title
npx hyperframes add yt-lcd-backgroundHyperFrames · Caption style
caption-blend-difference
Auto-inverting text using mix-blend-mode: difference — flips between white and black per-pixel against the background
npx hyperframes add caption-blend-differenceHyperFrames · Caption style
caption-camera-follow
One sentence written across a world far larger than the frame.
npx hyperframes add caption-camera-followHyperFrames · Caption style
caption-clip-wipe
Left-to-right clip-path wipe reveal per word
npx hyperframes add caption-clip-wipeHyperFrames · Caption style
caption-editorial-emphasis
Dual-font system with dramatic size contrast for emphasis words
npx hyperframes add caption-editorial-emphasisHyperFrames · Caption style
caption-emoji-pop
Emoji integration with stroked text and horizontal squeeze entrance
npx hyperframes add caption-emoji-popHyperFrames · Caption style
caption-glitch-rgb
RGB chromatic aberration with CRT scanline overlay
npx hyperframes add caption-glitch-rgbHyperFrames · Caption style
caption-gradient-fill
Gradient-clipped text with elastic bounce entrance
npx hyperframes add caption-gradient-fillHyperFrames · Caption style
caption-highlight
Red background sweep behind each active word, TikTok-style
npx hyperframes add caption-highlightHyperFrames · Caption style
caption-kinetic-slam
Full-screen single-word display with alternating entrance directions
npx hyperframes add caption-kinetic-slamHyperFrames · Caption style
caption-matrix-decode
Character scramble animation before text reveal
npx hyperframes add caption-matrix-decodeHyperFrames · Caption style
caption-neon-accent
Multi-color neon glow accents with wiggle drift animation
npx hyperframes add caption-neon-accentHyperFrames · Caption style
caption-neon-glow
Cyan and magenta neon glow with keyword accent colors
npx hyperframes add caption-neon-glowHyperFrames · Caption style
caption-parallax-layers
Behind-subject 3D text layering with vertical stretch effect
npx hyperframes add caption-parallax-layersHyperFrames · Caption style
caption-particle-burst
Keyword words trigger colored particle explosions
npx hyperframes add caption-particle-burstHyperFrames · Caption style
caption-pill-karaoke
Pill-shaped container with per-word karaoke color highlight
npx hyperframes add caption-pill-karaokeHyperFrames · Caption style
caption-texture
Flowing texture mask over large uppercase text — ships with 6 textures (lava, marble, metal, wood, concrete, rock), configurable via the texture variable
npx hyperframes add caption-textureHyperFrames · Caption style
caption-weight-shift
Elegant font-weight transition between caption lines
npx hyperframes add caption-weight-shiftHyperFrames · Caption style
community-camera-3d-captions
Captions placed at different depths around a talking head: camera whip-ins and parallax trucks pull groups apart, hero words pass behind the speaker through an alpha matte, and a ring of words can wrap the speaker.
npx hyperframes skillsApache-2.0Code ↗
HyperFrames · Caption style
embedded-captions-anchor
Quiet professional lower-third rail that fades up and simply reads; the climax word settles behind the subject with a drawn underline. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-arcade
8-bit cabinet HUD rail with CRT scanlines and a pixel-block boss-intro apex. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-aurora
Polar-night serif ink with a drifting rose-teal-violet sheen and ribbon draw-on apex. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-biolume
Deep-sea bioluminescence: words glow on like jellyfish with a bloom apex. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-brush
Sumi-e washi band where words are brush-wiped on in a Mincho serif. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-chalkboard
Night-lecture chalk band; words are scribbled in with dust puffs, apex is chalk-written. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-chrome
Liquid-metal hero words with sheen sweeps. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-cream
Warm poetic light: words emerge with a soft glow, embedded in the scene as a column flow. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-documentary
Burn-in stillness, bone-coloured text on charcoal. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-dossier
Cold-war case-file strip: typewriter characters hammer on, rubber-stamp apex. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-editorial
Lowercase italic serif with pen-stroke glides. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-glitch
Corrupted-feed RGB-split type. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-graffiti
Marker words flicked crooked onto a rail, spray-tagged handstyle apex. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-hologram
Captions as projected light: scanlined plate, interference glitch, hologram-boot apex. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-ink
Letterpress type pressed into bright surfaces. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-inkwater
Ink dropped in still water: serif words bleed into three reading rows, ink-bloom apex. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-keynote
Confident centred slides-in-the-scene look. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-laser
Concert laser rig in a blackout; each word is ignited where two beams meet. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-lastpage
Manuscript rail with a blurred future-field; a rack focus reveals the apex word. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-loud
Percussive type that competes with the face for the frame. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-neon
Captions as neon signage in the dark. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-neonsign
Warm tube-sign rail; the apex word is written stroke by stroke in neon. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-ordnance
Military stencil-stamp rail with a detonation apex word; everything has mass. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-papercut
Stop-motion paper craft: cream paper chips placed one by one on a kraft strip. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-popup
Pop-up-book page where words spring up on a hinge and the apex bursts as a centrefold. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-ransom
Ransom-note cutout chips from mixed typefaces with a slam apex. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-scoreboard
Split-flap chyron rail with departures-board apex; words flip-cycle before landing. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-spectrum
Oscilloscope band with a live waveform that kicks on every word; phosphor trace-write apex. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-stardust
Accumulating poem where letters condense from dust and disperse back. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills addHyperFrames · Caption style
embedded-captions-stomp
Hard-cut full-frame typographic takeover cards with a silent void before each drop. Identity of the embedded-captions skill for talking-head video.
npx hyperframes skills add