VideoFlowcodeGitHubStudioTry itCoreRenderersReact Video EditorPlaygroundExamplesDocscodeGitHubStudioTry it
Getting started
InstallationQuick startCore conceptsYour first video
Builder
Builder APITime formatsParallel & wait
Layers
TextImageVideoAudioCaptionsShapeGroups
Animation
Animate & keyframesEasing functionsTransitionsEffects
Renderers
Browser rendererServer rendererDOM preview
React Video Editor
QuickstartThemingUploadsCustom panelsHooks & commandsKeyboard shortcuts
API reference
Overview@videoflow/core@videoflow/renderer-browser@videoflow/renderer-server@videoflow/renderer-dom@videoflow/react-video-editor

Time formats

Every duration in VideoFlow passes through a single parser. You can give it a number, a string with a unit, a clock form, or a frame count — the parser returns seconds, and every downstream API works in seconds.

Supported inputs

InputSecondsNotes
55Any plain number is seconds.
0.50.5Fractions fine.
'2s'2Seconds with suffix.
'500ms'0.5Milliseconds.
'3m'180Minutes.
'1h'3600Hours.
'120f'depends on fpsAt 30 fps → 4s. At 60 → 2s.
'00:30'30mm:ss form.
'01:20:05'4805hh:mm:ss form.
'00:05:10:15'depends on fpshh:mm:ss:ff — ff is frames.

Where you can pass them

Anywhere the API accepts a duration. A partial list:

$.wait('2s');
$.wait(0.5);
$.wait('120f');                                    // 120 frames

layer.animate({...}, {...}, { duration: '750ms' });
layer.animate({...}, {...}, { duration: '30f' });  // frame-exact
layer.fadeIn('500ms');
layer.fadeOut('1s');

// Trim a clip's source — start 5s in, play sourceStart-relative.
$.addVideo({}, { source, sourceStart: '00:00:05' });

// Schedule a layer with the flow pattern instead of an explicit sourceDuration.
$.wait('2s');
const t = $.addText({ text: 'hi' });
$.wait('3s');
t.remove();

Frames and fps

Frame-count inputs ('120f', 'hh:mm:ss:ff') are parsed against the project's fps. If your flow is 30 fps, '30f' is one second. If you change the fps after the fact, all frame-based durations shift accordingly.

Tip. Mix units for readability: $.wait('1s'); $.wait('15f') is clearer than $.wait(1.5) when the 15 frames matter.

VideoFlow

Open-source toolkit for composing videos from code.

Product

CoreRenderersReact Video EditorPlaygroundStudio

Learn

DocsAPI referenceExamplesvs. Remotionvs. FFmpeg

Project

GitHubLicenseContactTermsPrivacy

From the blog

All posts →Animated Infographics as Code: Building a Reusable Data-Viz LibraryBeyond Static Images: Generating Dynamic Social Share Videos from MetadataHow to Embed a Full-Featured Video Editor in Your React AppStop Concatenating Strings: A Migration Guide from FFmpeg to VideoFlowHow to Give Your AI Agent a Video Tool: An LLM-to-Video PlaybookMarkdown to MP4: Automating Technical Explainer Videos with VideoFlowMastering GLSL Effects: Building Cinematic Pipelines with CodeMastering Timing in VideoFlow: The Wait and Parallel Playbook
© 2026 VideoFlow. Apache-2.0 core.