Power up your video editing

Combo is a refined video editor SDK, purpose-built to make video creation effortless and effective

Get started Schedule a call

Trusted by builders at

Easy-to-Use

Offers an intuitive API, simplifying video editing and integration for developers of all levels.

Fully Typed

Delivers comprehensive type definitions for a smooth development experience in both JavaScript and TypeScript.

Efficient Performance

Optimized for speed, ensuring smooth video rendering and editing, even with complex projects.

Powerful Tools

Comes with a rich set of features, including timeline management, media integration, and custom effects.

Build your editor at lightning speed

Scene

↗

The main editing workspace with an intuitive drag-and-drop functionality for easy manipulation of clips and assets.

import {Scene} from "@designcombo/react"
 
function SceneExample() {
	return (
		<Scene size={
			{
				width: 1280,
				height: 720
			}
		} />
	)
}

export default SceneExample

Animations

↗

Apply dynamic animations to text and video elements to enhance storytelling with engaging visual effects.

import { dispatch } from "@designcombo/react"
  
const applyAnimation = ( ) => {
	dispatch(EDIT_OBJECT, {
		payload: {
			details: {
				animation: {
					name: "fade-in",
				}
			}
		}
	})
}

Timeline

A visual interface for arranging and editing video clips, featuring multi-selection for efficient batch editing.

import { Timeline } from '@designcombo/react';
 
function TimelineExample() {

	return (
		<Timeline 
			theme={{
				width: 1280,
				height: 720
			}}
		/>
	)
}

Transitions

↗

Smooth visual effects between clips, including fades and wipes, to create a polished viewing experience.

const applyTransition = ( ) => {
	dispatch(ADD_TRANSITION, {
		payload: {
			details: {
				transition: {
					fromId: "item_uniquie_id_1",
					toId: "item_uniquie_id_2",
					kind: "slide-in",
					duration: 1000,
				}
			}
		}
	})
}

History

↗

Tracks all edits, allowing users to easily undo or redo actions for a non-destructive editing process.

import { dispatch } from "@designcombo/react"
import { UNDO, REDO, RESET } from "@designcombo/state";
 
const applyUndo = ( ) => {
	dispatch(UNDO)
}
 
const applyRedo = ( ) => {
	dispatch(REDO)
}
 
const applyRedo = ( ) => {
	dispatch(RESET)
}

Rendering

Render projects in multiple formats and resolutions for optimal sharing across various platforms.

import { Renderer } from '@designcombo/renderer';
 
const renderer = new Renderer();
 
renderer.render({
	design,
	format: 'mp4',
	fps: 30,
	quality: 'hd',
});
 
renderer.on('progress', ({ progress }) => {
	console.log('progress', progress);
})

Create your editor now

Read the docs Schedule a call