Image Generation with the AI SDK
Generate images with generateImage or stream image output through chat using the AI SDK
The @llmgateway/ai-sdk-provider package supports image generation both through the AI SDK's dedicated generateImage function and through chat-based image models that stream images as part of a conversation.
generateImage
Use llmgateway.image() to get an image model:
import { createLLMGateway } from "@llmgateway/ai-sdk-provider";
import { generateImage } from "ai";
import { writeFileSync } from "fs";
const llmgateway = createLLMGateway({
apiKey: process.env.LLM_GATEWAY_API_KEY,
});
const result = await generateImage({
model: llmgateway.image("gemini-3-pro-image-preview"),
prompt:
"A cozy cabin in a snowy mountain landscape at night with aurora borealis",
size: "1024x1024",
n: 1,
// aspectRatio and quality are model-specific — only some providers honor them.
// aspectRatio works on Gemini image models; OpenAI gpt-image-2 ignores it
// (use a literal WxH `size` instead).
aspectRatio: "16:9",
// quality works on OpenAI gpt-image-2 ("low" | "medium" | "high" | "auto").
// The AI SDK only forwards it through providerOptions.
providerOptions: {
llmgateway: { quality: "high" },
},
});
result.images.forEach((image, i) => {
const buf = Buffer.from(image.base64, "base64");
writeFileSync(`image-${i}.png`, buf);
});Which sizes, aspect ratios, and quality settings a model accepts depends on the model — see Image Generation for the full parameter reference and per-model behavior.
Chat-based image models
Multimodal models like gemini-3-pro-image-preview can return images inside a chat conversation. Use llmgateway.chat() with streamText in a route handler:
// app/api/chat/route.ts
import { createLLMGateway } from "@llmgateway/ai-sdk-provider";
import { convertToModelMessages, streamText } from "ai";
const llmgateway = createLLMGateway({
apiKey: process.env.LLM_GATEWAY_API_KEY,
});
export async function POST(req: Request) {
const { messages } = await req.json();
const result = streamText({
model: llmgateway.chat("gemini-3-pro-image-preview"),
messages: convertToModelMessages(messages),
});
return result.toUIMessageStreamResponse();
}On the client, image parts arrive as message file parts that you can render with the AI Elements Image component or a plain <img> tag with a data URL. See Image Generation for the complete useChat frontend example.
Video and audio
The AI SDK does not yet cover the gateway's video and speech endpoints — call them over REST instead:
- Video Generation —
POST /v1/videos(async jobs with optional signed callbacks) - Speech Generation —
POST /v1/audio/speech - Transcription —
POST /v1/audio/transcriptions
How is this guide?
Last updated on