Fill Wipe

Loading editor

Icon Fill Wipe Animation – Outline to Solid Reveal

Fill Wipe

About Fill Wipe

Colour floods up through the outline from the bottom edge until the icon reads solid. The moment a thing gets switched on.

Part of Icon Animations. New to this kind of graphic? Read How to Add Animated Icons to a Video.

Category
Icon Animations
Length
1.5 seconds, up to 15 seconds
Playback
Plays once
Controls
10 editable
Format
MP4 · WebM · PNG sequence
Alpha
WebM or PNG sequence
Resolution
720p to 8K
Aspect
16:9 · 9:16 · 1:1 · 4:5
License
Commercial use included

Frequently asked

What is the Fill Wipe animation?

Colour floods up through the outline from the bottom edge until the icon reads solid. The moment a thing gets switched on. It belongs to the Icon Animations category on velements, where you edit it in the browser and download it as a finished video file.

What can you customize in Fill Wipe?

Every control in the editor, grouped the same way there. Content: icon. Style: background, icon color, stroke width and accent. Layout: aspect ratio, icon size and position. Motion: duration and easing. Each change appears in the live preview straight away, and editing is free.

How long is Fill Wipe?

Fill Wipe runs 1.5 seconds by default, and you can set any length up to 15 seconds before you export. It plays once from start to finish, so it drops straight onto a cut or an opening.

Can you download Fill Wipe with a transparent background?

Yes. Set the background to Transparent, then export a PNG sequence for Premiere Pro, After Effects, DaVinci Resolve, Final Cut Pro or Figma: import the first frame as an image sequence and it drops onto a track above your footage with a straight alpha channel. Export WebM with a VP9 alpha channel for the web and for CapCut. MP4 has no alpha channel, so it keeps a solid color or image behind the animation.

Can you use Fill Wipe in commercial projects?

Yes. Each download comes with a perpetual commercial license in your name for client work, ads and products, and you may sell the edited clip on stock footage sites. Reselling the preset itself as an editable template is not allowed.

Related animations

  • Flip Y

    Flip Y

    2s

    The icon turns on its vertical axis like a card, thinning to an edge and thickening as it comes back round to the front.

  • Heartbeat Pulse

    Heartbeat Pulse

    3s

    A living double-beat pulse that makes hearts, likes and health icons feel alive.

  • Liquid Fill

    Liquid Fill

    3s

    A wavering surface climbs inside the outline, rocking as it rises, so the icon fills like a glass rather than a bar.

  • Particle Scatter

    Particle Scatter

    2s

    The icon springs in and throws a handful of small shapes outward, each arcing off on its own path before winking out.

  • Radial Fill

    Radial Fill

    1.5s

    Colour blooms out of the centre of the icon and pushes to the edges, filling the shape from the inside out.

  • Toggle Slash

    Toggle Slash

    1.5s

    A clean diagonal strikes through the icon and the shape behind it dims, turning any symbol into its switched-off twin.

  • Assemble In

    Assemble In

    2s

    Every piece of the icon flies in from its own direction, spinning as it comes, and locks into place with a springy stop.

  • Badge Reveal

    Badge Reveal

    2s

    A bold badge bursts open with a shockwave ring and the icon pops on top. Great for success states.