Generate Social Card

Generate an Open Graph social sharing card with dynamic title, description, and branding.

Who this is for

Content platforms and developer blogs use this recipe to generate an Open Graph image for social sharing. Define a canvas with your brand background and render the article title, description, and site name — ready for an og:image meta tag with a consistent, eye-catching preview.

Request
curl -X POST \
  https://api.iterationlayer.com/image-generation/v1/render \
  -H "Authorization: Bearer YOUR_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
    "dimensions": {
      "width": 1200,
      "height": 630
    },
    "output_format": "png",
    "layers": [
      {
        "index": 0,
        "type": "solid-color",
        "hex_color": "#0F172A"
      },
      {
        "index": 1,
        "type": "text",
        "text": "Building Scalable APIs with Elixir",
        "font_name": "Inter",
        "font_size_in_px": 48,
        "text_color": "#FFFFFF",
        "font_weight": "Bold",
        "position": { "x": 80.0, "y": 120.0 },
        "dimensions": { "width": 1040, "height": 200 }
      },
      {
        "index": 2,
        "type": "text",
        "text": "A practical guide to designing fault-tolerant API services",
        "font_name": "Inter",
        "font_size_in_px": 24,
        "text_color": "#94A3B8",
        "position": { "x": 80.0, "y": 360.0 },
        "dimensions": { "width": 1040, "height": 80 }
      },
      {
        "index": 3,
        "type": "text",
        "text": "iterationlayer.com",
        "font_name": "Inter",
        "font_size_in_px": 20,
        "text_color": "#6366F1",
        "position": { "x": 80.0, "y": 530.0 },
        "dimensions": { "width": 400, "height": 40 }
      }
    ]
  }'
Response
{
  "success": true,
  "data": {
    "buffer": "iVBORw0KGgoAAAANSUhEUgAA...",
    "mime_type": "image/png"
  }
}
Request
import { IterationLayer } from "iterationlayer";
const client = new IterationLayer({ apiKey: "YOUR_API_KEY" });

const result = await client.generateImage({
  dimensions: { width_in_px: 1200, height_in_px: 630 },
  output_format: "png",
  layers: [
    {
      index: 0,
      type: "solid-color",
      hex_color: "#0F172A",
    },
    {
      index: 1,
      type: "text",
      text: "Building Scalable APIs with Elixir",
      font_name: "Inter",
      font_size_in_px: 48,
      text_color: "#FFFFFF",
      font_weight: "Bold",
      position: { x: 80.0, y: 120.0 },
      dimensions: { width_in_px: 1040, height_in_px: 200 },
    },
    {
      index: 2,
      type: "text",
      text: "A practical guide to designing fault-tolerant API services",
      font_name: "Inter",
      font_size_in_px: 24,
      text_color: "#94A3B8",
      position: { x: 80.0, y: 360.0 },
      dimensions: { width_in_px: 1040, height_in_px: 80 },
    },
    {
      index: 3,
      type: "text",
      text: "iterationlayer.com",
      font_name: "Inter",
      font_size_in_px: 20,
      text_color: "#6366F1",
      position: { x: 80.0, y: 530.0 },
      dimensions: { width_in_px: 400, height_in_px: 40 },
    },
  ],
});

await Bun.write("result.png", Buffer.from(result.data.buffer, "base64"));
Response
{
  "success": true,
  "data": {
    "buffer": "iVBORw0KGgoAAAANSUhEUgAA...",
    "mime_type": "image/png"
  }
}
Request
import base64

from iterationlayer import IterationLayer
client = IterationLayer(api_key="YOUR_API_KEY")

result = client.generate_image(
    dimensions={"width_in_px": 1200, "height_in_px": 630},
    output_format="png",
    layers=[
        {
            "index": 0,
            "type": "solid-color",
            "hex_color": "#0F172A",
        },
        {
            "index": 1,
            "type": "text",
            "text": "Building Scalable APIs with Elixir",
            "font_name": "Inter",
            "font_size_in_px": 48,
            "text_color": "#FFFFFF",
            "font_weight": "Bold",
            "position": {"x": 80.0, "y": 120.0},
            "dimensions": {"width_in_px": 1040, "height_in_px": 200},
        },
        {
            "index": 2,
            "type": "text",
            "text": "A practical guide to designing fault-tolerant API services",
            "font_name": "Inter",
            "font_size_in_px": 24,
            "text_color": "#94A3B8",
            "position": {"x": 80.0, "y": 360.0},
            "dimensions": {"width_in_px": 1040, "height_in_px": 80},
        },
        {
            "index": 3,
            "type": "text",
            "text": "iterationlayer.com",
            "font_name": "Inter",
            "font_size_in_px": 20,
            "text_color": "#6366F1",
            "position": {"x": 80.0, "y": 530.0},
            "dimensions": {"width_in_px": 400, "height_in_px": 40},
        },
    ],
)

with open("result.png", "wb") as f:
    f.write(base64.b64decode(result["data"]["buffer"]))
Response
{
  "success": true,
  "data": {
    "buffer": "iVBORw0KGgoAAAANSUhEUgAA...",
    "mime_type": "image/png"
  }
}
Request
package main

import (
    "encoding/base64"
    "os"

    il "github.com/iterationlayer/sdk-go"
)

func main() {
    client := il.NewClient("YOUR_API_KEY")

    result, err := client.GenerateImage(
        il.GenerateImageRequest{
            Dimensions: il.Dimensions{
                WidthInPx: 1200, HeightInPx: 630,
            },
            OutputFormat: "png",
            Layers: []il.Layer{
                il.NewSolidColorBackgroundLayer(0, "#0F172A"),
                il.NewTextLayer(
                    1,
                    "Building Scalable APIs with Elixir",
                    "Inter", 48, "#FFFFFF",
                    il.Position{X: 80.0, Y: 120.0},
                    il.Dimensions{WidthInPx: 1040, HeightInPx: 200},
                ),
                il.NewTextLayer(
                    2,
                    "A practical guide to designing fault-tolerant API services",
                    "Inter", 24, "#94A3B8",
                    il.Position{X: 80.0, Y: 360.0},
                    il.Dimensions{WidthInPx: 1040, HeightInPx: 80},
                ),
                il.NewTextLayer(
                    3, "iterationlayer.com",
                    "Inter", 20, "#6366F1",
                    il.Position{X: 80.0, Y: 530.0},
                    il.Dimensions{WidthInPx: 400, HeightInPx: 40},
                ),
            },
        },
    )
    if err != nil {
        panic(err)
    }

    decoded, _ := base64.StdEncoding.DecodeString(result.Data.Buffer)
    os.WriteFile("result.png", decoded, 0644)
}
Response
{
  "success": true,
  "data": {
    "buffer": "iVBORw0KGgoAAAANSUhEUgAA...",
    "mime_type": "image/png"
  }
}

Related Recipes

Start building in minutes

Free trial credits included. No credit card required.