Motion Element

Ring Progress Animation for Video

A thick rounded ring sweeps to its share over a soft track while the percentage counts up in the middle of the card.

What Is the Ring Progress Card?

The Ring Progress Card is a square white card with a title, a single rounded ring and a large percentage in the centre, plus a caption for the detail underneath. The card rises, the ring sweeps clockwise to its share with a gradient stroke, the percentage counts up with the sweep and lands on the exact number, and the caption fades in once the ring settles. You set the title, the percentage, the caption, the card width, the accent, the track tint and the surface colours. Everything is frame-driven, so the live preview in the editor and the exported MP4 are identical down to the frame. The card is authored on a single design language shared by every element in this family: a white surface with a soft two-layer shadow, Inter with tight tracking, one accent colour, eased multi-stop gradients that never band, and figures that count up in step with the visual and land exactly on the target value. Pick a colourway, type your own numbers and labels, drop it on the canvas over your footage, and export without a watermark.

How It Works

The card rises, the ring sweeps clockwise to its share with a gradient stroke, the percentage counts up with the sweep and lands on the exact number, and the caption fades in once the ring settles. The element owns its own timeline: an enter phase where the card rises and settles, a build phase where the figure and the visual animate together from the same progress value, a hold phase that stretches to fill whatever duration you give the element, and an exit where the card fades and scales down. Because the hold is the only phase that stretches, the enter always plays at the start of your clip and the exit always lands at the end, however long the element runs.

Best For

  • -Savings goal progress
  • -Course or challenge completion
  • -Percentage of budget used
  • -Survey results with one headline number
  • -Any single share or completion rate

Best Platforms for Ring Progress Card

YouTube Shorts

Shorts viewers decide in the first two seconds. A ring progress card gives the number a shape they can read instantly, so the point lands before the voiceover finishes the sentence.

Instagram Reels

Reels are watched muted more often than not. The ring progress card carries the message visually, with the figure and the animation doing the talking when the audio is off.

TikTok

TikTok rewards a clear, confident visual beat. The card enters, builds and holds on its own schedule, so it drops cleanly onto a talking-head clip without any keyframing.

Why a ring progress card works in short-form video

A ring reads as completion at a glance, and one number in the centre is the cleanest possible framing for a percentage. Sweeping the ring while the number counts gives the stat a beat. The Ring Progress Card is a square white card with a title, a single rounded ring and a large percentage in the centre, plus a caption for the detail underneath. The element is built for the way people actually watch: vertical, fast, often muted, on a phone. That is why the figure is the hero and the visual is proof under it rather than a chart with axes and gridlines. Small text competing with the footage is noise at phone size, so the card shows one number, one label and one accent, and lets the motion carry the rest. It sits inside the same editor you use for captions on videocaptions.ai, so the element, the captions and the export all come from one timeline and one render.

Customising the ring progress card

You set the title, the percentage, the caption, the card width, the accent, the track tint and the surface colours. Every size on the card scales from a single width, so you can make it small in a corner or fill the frame and the type, spacing and shadows stay in proportion. Colourways are curated: Sky, Mint, Ember, Orchid and Ink each write the accent, tint and surface together so the card never ends up with a second hue fighting the first. If you edit one colour by hand the pill simply drops and your value stays. Duration is set on the timeline; the element stretches its hold phase to match, so the enter plays at the start and the exit lands at the end whatever length you choose. Export at 1080p or 4K as an H.264 MP4, or keep the transparent background and layer it in another editor.

Frequently Asked Questions

Everything you need to know before you start.

Can't find what you're looking for? Contact us

Create a Free Ring Progress Card Motion Element