Lines tilt between a before and after axis, colored by whether each item rose or fell. Type your own paired values.
Loading editor
Two dots per row connect with a bar to show the gap between them, growing into place. Type your own paired values.
Part of Animated Infographics. New to this kind of graphic? Read Animated charts: data that explains itself in seconds.
Two dots per row connect with a bar to show the gap between them, growing into place. Type your own paired values. It belongs to the Animated Infographics category on velements, where you edit it in the browser and download it as a finished video file.
Every control in the editor, grouped the same way there. Content: values, labels, suffix and competitor values. Typography: font. Style: background, text color, primary, secondary and accent. Layout: aspect ratio. Motion: duration and easing. Each change appears in the live preview straight away, and editing is free.
Dumbbell Chart runs 3 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.
Yes. Set the background to Transparent and export WebM with a VP9 alpha channel, then put it on a track above your footage. If your editor does not decode WebM alpha, transcode it once to an alpha codec it supports. MP4 has no alpha channel, so it keeps a solid color or image behind the animation.
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.
Lines tilt between a before and after axis, colored by whether each item rose or fell. Type your own paired values.
Bubbles sized by value pop onto an x/y plane for three-variable comparison. Type your own values and labels.
Horizontal bars race to their values side by side, making rankings and comparisons instantly clear.
Two series grow outward from a centered label column for back-to-back comparison. Type your own paired data.
A spider chart sweeps open across its axes and a second series overlays it for side-by-side comparison. Edit the data.
A divider sweeps across a browser window to compare a muted old design with your new one, then settles in the middle with labels.
A comparison divider with a draggable-style handle swings across the frame under Before and After labels.
Columns rise one by one with live counting values and the top performer highlighted. Type your own data.