Asset Studio is a powerful React canvas editor and asset creation library — images, video, audio, text, shapes, and animations in one SDK.
Features
A complete toolkit for building canvas-based editors and asset creation tools.
Add images, video, audio, text, shapes, and freehand drawings to your canvas with a unified item API.
Bring items to life with built-in animation support. Control timing, easing, and sequencing with ease.
Intuitive hooks like useStudio, useExport, and useZoom give full programmatic control.
Export your canvas as images or video with the useExport hook — ready for production use.
Enable freehand drawing sessions with pressure sensitivity and smooth path rendering via useDraw.
Organize your canvas work into sessions. Each session maintains its own state, items, and history.
Get started in minutes. Wrap your app with the providers, call a hook, and drop the Studio component wherever you need it.
View Quick Startimport { StudioProvider, Studio, useStudio }
from "@asset-studio/core";
function Editor() {
const { addItem } = useStudio();
const addImage = () =>
addItem({
type: "image",
x: 50, y: 50,
width: 300, height: 200,
itemProps: {
src: "https://example.com/photo.jpg",
},
});
return (
<div>
<button onClick={addImage}>Add Image</button>
<Studio width={1280} height={720} />
</div>
);
}
export default function App() {
return (
<StudioProvider>
<Editor />
</StudioProvider>
);
}Read the docs and start creating canvas experiences today.