velements

Shape Transitions

Shape transitions: how to cut between shots without a plugin

Updated September 18, 20263 min read

What is a shape transition?

A shape transition is a graphic wipe where a circle, bar or tile grid travels across the frame and hands the shot over to the next one. It hides the cut, carries your brand color and works in any editor once exported as MP4 or transparent WebM.

Hard cuts are honest but flat. A shape wipe gives the edit a beat and lets a brand color lead the eye from one scene to the next. Every preset below is a real animation you can retime, recolor and reframe before you export it.

Five shape transitions presets to start from

Hover any card to play it. Opening one loads it in the editor with every control unlocked.

  • Circle Reveal

    1s

    A layered circle expands from any point to cover the frame, then opens a clean hole into the next shot.

  • Diagonal Bars Wipe

    1s

    Angled two-tone bars race across the screen in a staggered sweep for energetic, sporty cuts.

  • Square Tile Cascade

    1.5s

    A checkerboard of rotating tiles cascades diagonally across the frame and dissolves away in the same rhythm.

  • Clock Sweep

    1s

    Four radial blades sweep around the center like a clock hand, covering and uncovering the frame.

  • Layered Swipe

    1s

    Three brand-colored panels slide over each other with soft rounded edges for a polished corporate cut.

All shape transitions

How to make one in the browser

  1. 01Open a shape transitions presetBrowse the Shape Transitions category and open the preset closest to what you need. It loads in the editor with every control unlocked.
  2. 02Make it yoursRewrite the text, set your brand colors and font, adjust easing and duration, and switch the aspect ratio for the platform you are posting to.
  3. 03Export the clipChoose MP4 for a normal track or transparent WebM for an overlay, pick a resolution up to 8K, and the file renders on your own machine.

Which format should you export?

Use MP4 when the clip sits on its own track or fills the frame. Use transparent WebM whenever it has to float over your own footage: the alpha channel is real, so no keying or blend mode is needed.

Format
MP4 H.264 · WebM VP9
Alpha
Transparent WebM
Resolution
720p to 8K
Aspect
16:9 · 9:16 · 1:1 · 4:5
License
Commercial use included

Three tips that make it look intentional

  • Match the wipe direction to the motion in your footage so the cut feels intentional.
  • Keep transitions under a second: anything longer reads as a title, not a cut.
  • Export on a transparent background when you want the wipe to sit over both shots in your editor.

Frequently asked

Do shape transitions work in CapCut and Premiere?
Yes. Export MP4 for a straight cut-in, or transparent WebM when you want the shape to travel over your own footage.
Can I match a shape transition to my brand?
Every preset exposes its colors, easing and duration, so you can set your exact brand hex and timing before exporting.

Keep reading

  • Text Animations

    Animated text: kinetic typography you can type into

    Pick a text preset, type your line, choose a font and weight, then set the colors, easing and duration. The preview renders the real animation, and the export is an MP4 or a transparent WebM you drop straight onto a track in your editor.

    Read the guide

  • Icon Animations

    Animated icons: small motion that explains a lot

    Choose an icon preset, pick an icon from the built-in library, set its color, size and stroke, then adjust how it draws, pops or pulses. Export a transparent WebM and the icon animates over any slide, app screen or footage without a matte.

    Read the guide

  • Logo Reveals

    Logo reveal: a brand intro without After Effects

    Open a logo reveal preset in the browser, upload your logo as a PNG, set the background and accent colors, choose a duration and export. The clip renders on your own machine as MP4 or transparent WebM, so no plugin, template file or render queue is involved.

    Read the guide