# Multi-Page Images

> Generate images from multi-page templates — render specific pages, batch generate carousels, or create image sets from a single template.

- **URL**: https://orshot.com/docs/image-generation/multi-page-images

---

Multi-page templates let you design multiple variations or slides within a single template. When generating images, you can render all pages at once or select specific ones.

## How Multi-Page Works

When your Studio template has multiple pages (e.g., a carousel, slide deck, or a set of variations), the API returns an array of images — one for each page.```javascript
const response = await fetch("https://api.orshot.com/v1/studio/render", {
  method: "POST",
  headers: {
    "Content-Type": "application/json",
    Authorization: "Bearer <YOUR_API_KEY>",
  },
  body: JSON.stringify({
    templateId: "<MULTI_PAGE_TEMPLATE_ID>",
    modifications: {
      "page1@title": "Slide 1: Introduction",
      "page2@title": "Slide 2: Features",
      "page3@title": "Slide 3: Pricing",
    },
    response: {
      format: "png",
      type: "url",
    },
  }),
});
```### Response

The response returns a `content` array with one entry per page:```json
{
  "data": {
    "content": [
      "https://storage.orshot.com/cloud/renders/images/page1.png",
      "https://storage.orshot.com/cloud/renders/images/page2.png",
      "https://storage.orshot.com/cloud/renders/images/page3.png"
    ],
    "renders": 3,
    "mimeType": "image/png"
  }
}
```## Rendering Specific Pages

Use `response.includePages` to render only the pages you need. This saves render credits and speeds up generation.```json
{
  "templateId": "<MULTI_PAGE_TEMPLATE_ID>",
  "modifications": {
    "page1@title": "Cover Slide",
    "page3@title": "Final Slide"
  },
  "response": {
    "format": "png",
    "type": "url",
    "includePages": [1, 3]
  }
}
```This renders only pages 1 and 3, skipping page 2.

## Page-Specific Modifications

Use the `page@` prefix to target elements on specific pages. This lets you customize each page independently.```json
{
  "modifications": {
    "page1@title": "Why Choose Us",
    "page1@subtitle": "Trusted by 10,000+ teams",
    "page1@background": "https://example.com/bg-blue.jpg",

    "page2@title": "Key Features",
    "page2@subtitle": "Everything you need to scale",
    "page2@background": "https://example.com/bg-purple.jpg",

    "page3@title": "Get Started Today",
    "page3@subtitle": "Start your free trial",
    "page3@background": "https://example.com/bg-green.jpg"
  }
}
```You can also apply styles per page:```json
{
  "modifications": {
    "page1@title": "Dark Theme Slide",
    "page1@title.color": "#ffffff",
    "page1@canvasBackgroundColor": "#0f172a",

    "page2@title": "Light Theme Slide",
    "page2@title.color": "#1a1a1a",
    "page2@canvasBackgroundColor": "#ffffff"
  }
}
```## Example: Instagram Carousel

Generate a 5-slide Instagram carousel from a single template:```javascript
const slides = [
  { title: "5 Tips for Better Sleep", subtitle: "A quick guide" },
  {
    title: "Tip 1: Consistent Schedule",
    subtitle: "Go to bed at the same time every night",
  },
  {
    title: "Tip 2: Limit Screen Time",
    subtitle: "Put your phone away 1 hour before bed",
  },
  {
    title: "Tip 3: Cool Environment",
    subtitle: "Keep your room between 60-67°F",
  },
  { title: "Swipe for More", subtitle: "Follow us for daily tips" },
];

const modifications = {};
slides.forEach((slide, i) => {
  modifications[`page${i + 1}@title`] = slide.title;
  modifications[`page${i + 1}@subtitle`] = slide.subtitle;
});

const response = await fetch("https://api.orshot.com/v1/studio/render", {
  method: "POST",
  headers: {
    "Content-Type": "application/json",
    Authorization: "Bearer <YOUR_API_KEY>",
  },
  body: JSON.stringify({
    templateId: "<CAROUSEL_TEMPLATE_ID>",
    modifications,
    response: {
      format: "png",
      type: "url",
    },
  }),
});

const data = await response.json();
// data.data.content = array of 5 image URLs
```## Global vs Page-Specific Modifications

If you pass a modification **without** the `page@` prefix, it applies to **all pages**:```json
{
  "modifications": {
    "brand_logo": "https://example.com/logo.png",
    "page1@title": "Page 1 Title",
    "page2@title": "Page 2 Title"
  }
}
```In this example, `brand_logo` is updated on every page, while each `title` is set independently.

## Flow Text (Automatic Multi-Page)

If your template uses [flowing content](https://orshot.com/docs/orshot-studio/flowing-content) (text with `textMode: "flow"`), additional pages are created automatically based on how much text there is. You don't need to design each page — the flow engine handles page breaks.

The API request is the same as any render. The response includes all generated pages:```json
{
  "data": [
    { "page": 1, "pageId": "abc-123", "content": "https://..." },
    { "page": 2, "content": "https://...", "sourcePageNumber": 1, "flowPage": 1 },
    { "page": 3, "content": "https://...", "sourcePageNumber": 1, "flowPage": 2 }
  ],
  "totalPages": 3,
  "flowTotalPages": 2
}
```Overflow pages include `sourcePageNumber` (the template page they came from) and `flowPage` (which overflow page it is). Use `includePages` to render only specific pages from the flow output.