Free, Unlimited ByteDance Seedance API
This tutorial shows how to use Puter.js for generating videos with ByteDance Seedance models for free, without needing API keys or backend infrastructure. With Puter.js, you gain immediate access to Seedance AI models such as Seedance 1.0 Lite for fast video generation and Seedance 1.0 Pro for superior quality, all callable directly from client-side JavaScript.
Through Puter's "User-Pays" model, you can integrate advanced AI video generation into your apps while users handle their individual usage costs. This approach lets you deliver video generation features without incurring costs, managing API credentials, or configuring server infrastructure.
Getting Started
Using Puter.js requires zero configuration and no API keys. Simply add this script tag to your HTML file (works in both <head> and <body> sections):
<script src="https://js.puter.com/v2/"></script>
This single script tag is all you need to start generating videos with Seedance models in your application.
Example 1: Generate a video with Seedance 1.0 Lite
Seedance 1.0 Lite enables fast and cost-effective video generation. To generate a video using Seedance 1.0 Lite, use the puter.ai.txt2vid() function:
puter.ai.txt2vid(
"A fox sprinting through a snow-covered forest at dusk",
{ model: "ByteDance/Seedance-1.0-lite" }
)
.then(videoElement => {
document.body.appendChild(videoElement);
videoElement.addEventListener('loadeddata', () => videoElement.play().catch(() => {}));
})
Full code example:
<html>
<body>
<h1>Seedance 1.0 Lite Video Generation</h1>
<div id="status"></div>
<script src="https://js.puter.com/v2/"></script>
<script>
// Start timer
const status = document.getElementById('status');
const startTime = Date.now();
const timerInterval = setInterval(() => {
const elapsed = ((Date.now() - startTime) / 1000).toFixed(1);
status.textContent = `Loading (${elapsed} seconds)`;
}, 100);
// Generate video
puter.ai.txt2vid(
"A fox sprinting through a snow-covered forest at dusk",
{ model: "ByteDance/Seedance-1.0-lite" }
)
.then(videoElement => {
document.body.appendChild(videoElement);
videoElement.addEventListener('loadeddata', () => videoElement.play().catch(() => {}));
// Clear timer and show finished status
clearInterval(timerInterval);
const totalTime = ((Date.now() - startTime) / 1000).toFixed(1);
status.textContent = `Finished (${totalTime} seconds)`;
}).catch(error => {
console.error(error);
clearInterval(timerInterval);
status.textContent = JSON.stringify(error);
})
</script>
</body>
</html>
Example 2: Generate high-quality video with Seedance 1.0 Pro
Seedance 1.0 Pro is a larger, more advanced model with superior quality and detail. To generate a video using Seedance 1.0 Pro, simply change the model parameter:
<html>
<body>
<h1>Seedance 1.0 Pro Video Generation</h1>
<div id="status"></div>
<script src="https://js.puter.com/v2/"></script>
<script>
// Start timer
const status = document.getElementById('status');
const startTime = Date.now();
const timerInterval = setInterval(() => {
const elapsed = ((Date.now() - startTime) / 1000).toFixed(1);
status.textContent = `Loading (${elapsed} seconds)`;
}, 100);
// Generate video
puter.ai.txt2vid(
"A majestic dragon flying through clouds at sunset, cinematic lighting, 4k quality",
{ model: "ByteDance/Seedance-1.0-pro" }
)
.then(videoElement => {
document.body.appendChild(videoElement);
videoElement.addEventListener('loadeddata', () => videoElement.play().catch(() => {}));
// Clear timer and show finished status
clearInterval(timerInterval);
const totalTime = ((Date.now() - startTime) / 1000).toFixed(1);
status.textContent = `Finished (${totalTime} seconds)`;
}).catch(error => {
console.error(error);
clearInterval(timerInterval);
status.textContent = JSON.stringify(error);
})
</script>
</body>
</html>
Example 3: Custom video size generation
Seedance video generation models support custom video dimensions. You can specify the width and height for your generated videos:
<html>
<body>
<h1>Custom Size Video Generation</h1>
<div id="status"></div>
<script src="https://js.puter.com/v2/"></script>
<script>
// Start timer
const status = document.getElementById('status');
const startTime = Date.now();
const timerInterval = setInterval(() => {
const elapsed = ((Date.now() - startTime) / 1000).toFixed(1);
status.textContent = `Loading (${elapsed} seconds)`;
}, 100);
// Generate video
puter.ai.txt2vid(
"A bustling Tokyo street at night with neon signs reflecting on wet pavement",
{
model: "ByteDance/Seedance-1.0-lite",
width: 864,
height: 480
}
)
.then(videoElement => {
document.body.appendChild(videoElement);
videoElement.addEventListener('loadeddata', () => videoElement.play().catch(() => {}));
// Clear timer and show finished status
clearInterval(timerInterval);
const totalTime = ((Date.now() - startTime) / 1000).toFixed(1);
status.textContent = `Finished (${totalTime} seconds)`;
}).catch(error => {
console.error(error);
clearInterval(timerInterval);
status.textContent = JSON.stringify(error);
})
</script>
</body>
</html>
Supported Video Sizes
Seedance models support the following video dimensions (width × height):
864×480 736×544 640×640
960×416 416×960 1248×704
1120×832 960×960 1504×640
640×1504
Available Models
The following ByteDance Seedance models are supported by Puter.js, which can be used with the puter.ai.txt2vid() function:
ByteDance/Seedance-1.0-lite
ByteDance/Seedance-1.0-pro
You're all set! With Puter.js, you've unlocked free access to ByteDance Seedance's powerful video generation models. Build stunning AI-powered video generation features into your apps—no API keys to manage, no backend servers to maintain, and zero infrastructure costs. Experience truly serverless video generation with Seedance!
Related
Free, Serverless AI and Cloud
Start creating powerful web applications with Puter.js in seconds!
Get Started Now