Overview

What it does

The Mockly API renders mockup screenshots and videos over HTTP. You send a JSON payload describing what to render — a chat conversation, an AI chat, a social post, a comment thread, a story, or an email — and get back a PNG (synchronously) or, for animated types, an MP4 (asynchronously, with a status URL to poll).

It's the same render pipeline the editor uses, exposed as a paid HTTP API. Six mockup types across 40+ apps:

Type	mockupType	Apps	Output
Chats	chats	WhatsApp, iMessage, Instagram, Discord, Telegram, +18 more	image + video
AI chats	ai	ChatGPT, Claude, Gemini, Grok, Perplexity	image + video
Stories	stories	Instagram, Snapchat	image + video
Posts	posts	X, Instagram, LinkedIn, Threads, Bluesky, +3 more	image
Comments	comments	YouTube, Instagram, TikTok, X, Reddit, +3 more	image
Emails	emails	Gmail, Apple Mail, Outlook, Leaked-style	image

Prerequisites

You need three things before you can call the API:

1. A Mockly account. Free to create at getmockly.com.
2. An active API subscription — $99/month, monthly billing, cancel anytime. Subscribe from your account page.
3. An API key — once subscribed, mint a key under API keys. Keys are shown once at creation and start with mk_live_.

Quick start

Render a WhatsApp chat as a PNG with one cURL:

curl -X POST https://www.getmockly.com/api/v1/render \
  -H "Authorization: Bearer mk_live_..." \
  -H "Content-Type: application/json" \
  -d '{
    "mockupType": "chats",
    "platform": "whatsapp",
    "renderKind": "image",
    "resolutionScale": "2x",
    "rendererVersion": "mockup-remotion-v1",
    "props": {
      "platform": "whatsapp",
      "sender": { "id": "u1", "name": "Alex" },
      "receivers": [{ "id": "u2", "name": "Sam" }],
      "messages": [
        { "id": "m1", "type": "text", "userId": "u1", "text": "Hey!", "timestamp": "2026-04-30T10:15:00Z" },
        { "id": "m2", "type": "text", "userId": "u2", "text": "What's up?", "timestamp": "2026-04-30T10:15:30Z" }
      ]
    }
  }'

The response (200):

{
  "id": "abc-123-...",
  "status": "completed",
  "renderKind": "image",
  "format": "png",
  "downloadUrl": "https://...",
  "sizeBytes": 482113
}

Fetch downloadUrl to download the PNG. The URL is short-lived; download promptly or call GET /api/v1/exports/:id to get a fresh one.

The other mockup types follow the same shape — change mockupType and the props. Here's a LinkedIn post:

curl -X POST https://www.getmockly.com/api/v1/render \
  -H "Authorization: Bearer mk_live_..." \
  -H "Content-Type: application/json" \
  -d '{
    "mockupType": "posts",
    "platform": "linkedin",
    "renderKind": "image",
    "resolutionScale": "2x",
    "rendererVersion": "mockup-remotion-v1",
    "props": {
      "platform": "linkedin",
      "post": {
        "id": "p1",
        "author": { "name": "Sarah Johnson", "subtitle": "Product Designer" },
        "content": "We just shipped our new mockup API. One endpoint, six mockup types.",
        "timestamp": "2026-04-30T10:15:00Z",
        "metrics": { "reactions": 182, "comments": 24, "reposts": 11 }
      }
    }
  }'

See Schema for every type's props.

Next steps

• Authentication — how Bearer tokens work and how to manage keys.
• POST /render — full reference for image and video renders.
• Exports — status polling and downloads.
• Schema — every field of the request body.
• Errors — codes, retry guidance.