Tutorials

Free, Unlimited Stable Diffusion API

This guide demonstrates how to leverage Puter.js for generating images with Stable Diffusion AI models at no cost, eliminating the need for API keys or backend infrastructure. With Puter.js, you gain immediate access to industry-leading Stable Diffusion models such as Stable Diffusion 3 Medium and Stable Diffusion XL, all callable directly from client-side JavaScript.

Through Puter's innovative "User-Pays" model, developers can integrate sophisticated AI image generation into their apps while users handle their individual usage expenses. This approach lets you deliver professional-grade image generation features without incurring costs, managing API credentials, or configuring server infrastructure.

Getting Started

Using Puter.js requires zero configuration—no API keys, no sign-up process. Simply add this script tag to your HTML file (works in both <head> and <body> sections):

<script src="https://js.puter.com/v2/"></script>

That single line is all you need to start generating images with Stable Diffusion models in your application.

Example 1Generate an image with Stable Diffusion 3

To generate an image using Stable Diffusion 3 Medium, use the puter.ai.txt2img() function:

puter.ai.txt2img(
    "A serene Japanese garden with cherry blossoms and a koi pond",
    { model: "stabilityai/stable-diffusion-3-medium" }
)
.then(imageElement => {
    document.body.appendChild(imageElement);
});

Full code example:

<html>
<body>
    <h1>Stable Diffusion 3 Image Generation</h1>
    <script src="https://js.puter.com/v2/"></script>
    <script>
        puter.ai.txt2img(
            "A serene Japanese garden with cherry blossoms and a koi pond",
            { model: "stabilityai/stable-diffusion-3-medium" }
        )
        .then(imageElement => {
            document.body.appendChild(imageElement);
        });
    </script>
</body>
</html>

Example 2Generate an image with Stable Diffusion XL

To generate an image using Stable Diffusion XL, simply change the model parameter:

puter.ai.txt2img(
    "A cyberpunk cityscape with neon lights and flying vehicles",
    { model: "stabilityai/stable-diffusion-xl-base-1.0" }
)
.then(imageElement => {
    document.body.appendChild(imageElement);
});

Full code example:

<html>
<body>
    <h1>Stable Diffusion XL Image Generation</h1>
    <script src="https://js.puter.com/v2/"></script>
    <script>
        puter.ai.txt2img(
            "A cyberpunk cityscape with neon lights and flying vehicles",
            { model: "stabilityai/stable-diffusion-xl-base-1.0" }
        )
        .then(imageElement => {
            document.body.appendChild(imageElement);
        });
    </script>
</body>
</html>

Example 3Advanced Generation with Negative Prompts and Custom Parameters

This example demonstrates advanced options like negative prompts, custom dimensions, seed control, and diffusion steps for more precise image generation:

puter.ai.txt2img(
    "A majestic dragon perched on a mountain peak, fantasy art style, detailed scales, dramatic lighting",
    {
        model: "stabilityai/stable-diffusion-3-medium",
        width: 768,
        height: 1024,
        steps: 30,
        seed: 42,
        negative_prompt: "blurry, low quality, distorted, ugly, bad anatomy, watermark, text, signature"
    }
)
.then(imageElement => {
    document.body.appendChild(imageElement);
});

Full code example:

<html>
<body>
    <h1>Advanced Stable Diffusion Generation</h1>
    <button onclick="generateImage()">Generate Dragon Art</button>
    <div id="imageContainer"></div>
    
    <script src="https://js.puter.com/v2/"></script>
    <script>
        function generateImage() {
            // Clear previous image
            document.getElementById('imageContainer').innerHTML = 'Generating...';
            
            puter.ai.txt2img(
                "A majestic dragon perched on a mountain peak, fantasy art style, detailed scales, dramatic lighting",
                {
                    model: "stabilityai/stable-diffusion-3-medium",
                    width: 768,
                    height: 1024,
                    steps: 30,
                    seed: 42, // Same seed will produce consistent results
                    negative_prompt: "blurry, low quality, distorted, ugly, bad anatomy, watermark, text, signature"
                }
            )
            .then(imageElement => {
                document.getElementById('imageContainer').innerHTML = '';
                document.getElementById('imageContainer').appendChild(imageElement);
            });
        }
    </script>
</body>
</html>

Supported Stable Diffusion Models

The following Stable Diffusion models are supported by Puter.js, which can be used with the puter.ai.txt2img() function:

stabilityai/stable-diffusion-3-medium
stabilityai/stable-diffusion-xl-base-1.0



You're all set! With Puter.js, you've unlocked free access to Stable Diffusion's powerful models. Build stunning AI-powered image generation features into your apps—no API keys to manage, no backend servers to maintain, and zero infrastructure costs. Experience truly serverless image generation with Stable Diffusion!

Related

Free, Serverless AI and Cloud

Start creating powerful web applications with Puter.js in seconds!

Get Started Now

Read the Docs • Try the Playground