Quickstart

Fastest: connect the MCP server

Nothing to install and no API key to copy. Add the hosted varg MCP server to your AI tool and sign in with your varg account when the browser opens. Your assistant gets native tools for generate_image, generate_video, generate_speech, generate_music, and render_video, plus the full model catalog.

Claude Code
Cursor
VS Code
Claude.ai / ChatGPT

claude mcp add --transport http varg https://mcp.varg.ai/mcp

Then run /mcp inside Claude Code to sign in.

Add to .cursor/mcp.json:

{
  "mcpServers": {
    "varg": {
      "url": "https://mcp.varg.ai/mcp"
    }
  }
}

code --add-mcp '{"name":"varg","url":"https://mcp.varg.ai/mcp"}'

Open Settings → Connectors, choose Add custom connector, and paste:

https://mcp.varg.ai/mcp

Then ask for what you want: “Make a 5-second video of a fox running through snow, 16:9, and a 30-second ambient music track to go with it” Setup for every client, the full tool list, and team billing: MCP Server. The server is listed in the official MCP Registry as ai.varg/mcp.

For full videos: AI agent + skill

For finished multi-scene videos with captions, lipsync, music, and transitions, use an AI coding agent (Claude Code, Cursor, Windsurf, etc.) with the varg skill installed. The skill gives your agent full context on components, models, prompting, and rendering.

Get your API key

Install the varg skill

npx -y skills add vargHQ/skills --all --copy -y

This installs the varg skill into Claude Code, Cursor, Windsurf, and 40+ other agents automatically.

Set your API key

export VARG_API_KEY=varg_live_xxx

Create your first video

claude "create a 10-second product video for white sneakers, 9:16, UGC style, with captions and background music"

Or with Cursor, Windsurf, or any other agent — just prompt it the same way:“Create a 10-second TikTok video of a cute robot waving hello with upbeat music and captions”

That’s it. The agent handles all the TSX code, rendering, and file management for you.

First render takes 1-2 minutes (AI generation). Subsequent runs with the same prompts are instant (cached at $0).

Pricing

1 credit = 1 cent. Typical costs:

Action	Model	Credits	Cost
Image	grok_imagine_image	4	$0.04
Image	flux_dev	68	$0.68
Image	nano_banana_pro	126	$1.26
Video (5s)	wan_2.5	158	$1.58
Video (5s)	kling_v3	221	$2.21
Speech	eleven_turbo_v2_5	105	$1.05
Music	music_v1	79	$0.79
Cache hit	any	0	$0.00

A typical 3-clip video costs $2-5. Cache hits are always free. Live catalog: api.varg.ai/v2/pricing.

Alternative: Cloud Render (curl only)

No installation needed. Submit TSX code to the Render API via curl:

# Submit a render job
JOB=$(curl -s -X POST https://api.varg.ai/v2/render \
  -H "Authorization: Bearer $VARG_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
    "code": "const img = Image({ model: fal.imageModel(\"nano_banana_pro\"), prompt: \"a cabin in mountains at sunset\", aspectRatio: \"16:9\" });\nexport default (<Render width={1920} height={1080}><Clip duration={3}>{img}</Clip></Render>);"
  }')

JOB_ID=$(echo $JOB | jq -r '.id')

# Poll for result
curl -s "https://api.varg.ai/v2/jobs/$JOB_ID" \
  -H "Authorization: Bearer $VARG_API_KEY"

# When completed, the video URL is in .output.outputs[0].url

Cloud render uses fal.*Model() syntax — provider globals are auto-injected server-side. See the Render API reference for full details.

Alternative: Local Render (bun + ffmpeg)

For full control, render videos locally. Requires Bun and ffmpeg.

Installation

Bun (recommended)
npm

bun install vargai ai

npm install vargai ai

Set your API key

Create a .env file in your project root:

VARG_API_KEY=varg_xxx

Bun auto-loads .env files — no dotenv needed.

Your first video

Create hello.tsx:

/** @jsxImportSource vargai */
import { Render, Clip, Image, Video } from "vargai/react"
import { createVarg } from "vargai/ai"

const varg = createVarg({ apiKey: process.env.VARG_API_KEY! })

const character = Image({
  model: varg.imageModel("nano-banana-pro"),
  prompt: "cute kawaii fluffy orange cat character, round body, big eyes, Pixar style",
  aspectRatio: "9:16",
})

export default (
  <Render width={1080} height={1920}>
    <Clip duration={5}>
      <Video
        prompt={{
          text: "character waves hello enthusiastically, bounces up and down",
          images: [character],
        }}
        model={varg.videoModel("kling-v3")}
      />
    </Clip>
  </Render>
)

Render it:

bunx vargai render hello.tsx --preview   # free preview (placeholders)
bunx vargai render hello.tsx --verbose   # full render (costs credits)

Add music

/** @jsxImportSource vargai */
import { Render, Clip, Image, Video, Music } from "vargai/react"
import { createVarg } from "vargai/ai"

const varg = createVarg({ apiKey: process.env.VARG_API_KEY! })

const character = Image({
  model: varg.imageModel("nano-banana-pro"),
  prompt: "cute kawaii cat character, Pixar style",
  aspectRatio: "9:16",
})

export default (
  <Render width={1080} height={1920}>
    <Music
      prompt="upbeat happy electronic music, cheerful vibes"
      model={varg.musicModel()}
      volume={0.3}
      duration={5}
    />
    <Clip duration={5}>
      <Video
        prompt={{ text: "cat dancing happily", images: [character] }}
        model={varg.videoModel("kling-v3")}
      />
    </Clip>
  </Render>
)

Add voiceover with captions

/** @jsxImportSource vargai */
import { Render, Clip, Image, Video, Speech, Captions } from "vargai/react"
import { createVarg } from "vargai/ai"

const varg = createVarg({ apiKey: process.env.VARG_API_KEY! })

const character = Image({
  model: varg.imageModel("nano-banana-pro"),
  prompt: "friendly robot character, blue metallic, expressive eyes",
  aspectRatio: "9:16",
})

const voiceover = Speech({
  model: varg.speechModel("eleven_v3"),
  voice: "adam",
  children: "Hello! I'm your AI assistant. Let me show you something cool!",
})

export default (
  <Render width={1080} height={1920}>
    <Clip duration={5}>
      <Video
        prompt={{ text: "robot talking, subtle head movements", images: [character] }}
        model={varg.videoModel("kling-v3")}
      />
    </Clip>
    <Captions src={voiceover} style="tiktok" color="#ffffff" withAudio />
  </Render>
)

Project structure

Recommended layout:

my-video-project/
├── .env              # VARG_API_KEY=varg_xxx
├── package.json
├── output/           # Generated videos
├── .cache/ai/        # Cached AI generations
└── videos/
    ├── intro.tsx
    ├── episode-1.tsx
    └── outro.tsx

Next steps

Components Reference

All JSX components and their props

AI Models

All supported models with pricing

Templates

Copy-paste examples for common video types

Cloud Render API

Submit TSX via API — zero local dependencies

API Reference

Every REST endpoint, async jobs, errors and billing

OpenAPI Spec

OpenAPI 3.1 spec for generating typed clients

Get Started

Models

SDK

Templates

AI Agents

Comparisons

Fastest: connect the MCP server

For full videos: AI agent + skill

Pricing

Alternative: Cloud Render (curl only)

Alternative: Local Render (bun + ffmpeg)

Installation

Set your API key

Your first video

Add music

Add voiceover with captions

Project structure

Next steps

Components Reference

AI Models

Templates

Cloud Render API

API Reference

OpenAPI Spec

​Fastest: connect the MCP server

​For full videos: AI agent + skill

​Pricing

​Alternative: Cloud Render (curl only)

​Alternative: Local Render (bun + ffmpeg)

​Installation

​Set your API key

​Your first video

​Add music

​Add voiceover with captions

​Project structure

​Next steps

Components Reference

AI Models

Templates

Cloud Render API

API Reference

OpenAPI Spec

Fastest: connect the MCP server

For full videos: AI agent + skill

Pricing

Alternative: Cloud Render (curl only)

Alternative: Local Render (bun + ffmpeg)

Installation

Set your API key

Your first video

Add music

Add voiceover with captions

Project structure

Next steps