Path Carousel 2

HTML to video · A picture layout · Apache-2.0

What it does

Image cards ride an open bezier path (arc, V, diagonal, wave, S-curve) with depth scaling and tangent rotation (Path style 2); 12 image slots. Credited to Jake Moran.

Get it

Copy the folder into a project, or npx hyperframes add carousel-path-2 (fetches it from GitHub main to compositions/carousel-path-2.html). It is a whole page with its own timeline: render it alone, or mount it in a film as a sub-composition. 14 settings to change.

Source on GitHub
Needs

Loads its libraries from the network when it renders (cdn.jsdelivr.net).

Re-skin

By props (colors, pictures)

Declared variables: image1, image2, image3, image4, image5, image6, image7, image8 and 6 more. 3 hex colors and 1 font stack are written in the file's CSS. It also reads its own custom properties with fallbacks (--background); set them on a wrapping element to re-skin it without editing.

Size

1920 x 1080 · 6 s

License

Apache-2.0

License notes are on the pack's page

From

HyperFrames

Everything from HyperFrames in the gallery

Back to the Asset Library