Speed stripes

Diagonal stripes in the brand's colours race across in a stagger to cover the frame, then race off to reveal the next shot.

  • transitions/stripes
  • Transitions
  • transition
  • Overlay with alpha
  • 1.1 s (0.5–4 s)
Live in your browser
Speed stripes at 16:9
0.00 / 1.10 s
Playing live with volito/browser, the engine a render uses. Each tab lays the item out again for that shape, not a crop. The graphic is transparent; the grey stands in for your footage.

Render it

npx volito render transitions/stripes --out stripes.mov

That writes ProRes 4444 with alpha, ready to drop over footage. The same item in another shape, brand or format:

volito render transitions/stripes --aspect 9:16 --style cobalt --out stripes-9x16.mov
volito render transitions/stripes --format mp4 --out stripes.mp4
volito still transitions/stripes --t 0.24 --out stripes.png
volito info transitions/stripes     # every prop and part
volito add transitions/stripes      # copy its source into ./motion to edit

From Node:

import { findItem, renderVideo } from "volito";

await renderVideo(findItem("transitions/stripes"), { props: {}, out: "stripes.mov" });

Or ask an agent with the MCP server connected: “Render the Volito speed stripes (transitions/stripes) in 9:16, in our brand.”

Props

Set each with --prop name=value, or all at once with --props and a JSON object.

PropTypeDefaultTakes
stripesnumber73 – 16
directionchoicerightright | left
colors
Colours
brand: the accents lead and the brand's ground covers
choicebrandbrand | accent | black | white
label
Word at the cut
shown while the frame is covered (empty for none)
text—≤ 24 chars

Parts

Each part takes any move, ease or idle: --motion cover.in=pop.

PartWhat it is
coverthe shapes that cover the frame
labelthe word at the cut

Tags: transition, stripes, diagonal, speed, sport, swipe

More in Transitions