Power up yourvideo editing.

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

Build your editor
at lightning speed.

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.

Customizable

Provides extensive flexibility, allowing developers to tailor the SDK to fit their unique video editing needs.

Extensible

Designed to support easy expansion, enabling integration with third-party tools and custom features.

Components

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.

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.