---
title: "Tweet Mockup Image API: Brand-Safe Tweet Cards from JSON"
description: "Render tweet-styled cards with the tweet mockup image API. POST handle, body, and metrics; get back a 1200x800 PNG that respects your brand styling."
url: "https://html2img.com/templates/tweet-mockup-card/"
---

# Tweet Mockup Card: Tweet Card Image Generator API

Send display name, handle, and tweet body as JSON, get back a 1200x800 PNG styled like a tweet card.

Marketing teams and presentation builders use the tweet mockup image API to display real customer tweets and quotes in branded artwork rather than embedding the live tweet. The 1200x800 layout reads as familiar but lives on your domain, so the page does not load tracking pixels or stutter on the Twitter widget. You post the display name, handle, body, and optional metrics as JSON, and the response holds a PNG that drops cleanly into a slide deck, newsletter, or blog post.

## At a glance

- **Template slug:** `tweet-mockup-card`
- **Category:** social
- **Endpoint:** `POST https://app.html2img.com/api/v1/templates/tweet-mockup-card`
- **Authentication:** `X-API-Key` header
- **Cost:** one credit per render, PNG or PDF
- **Page:** https://html2img.com/templates/tweet-mockup-card/

## Fields

| Field | Type | Required | Example |
| --- | --- | --- | --- |
| `display_name` | string | Yes | Jordan Whitfield |
| `handle` | string | Yes | @jwhitfield |
| `body` | string | Yes | shipped a tiny side project this weekend and it already has more users than my last YC company funny how that works |
| `avatar_url` | url | No | https://i.pravatar.cc/160?img=15 |
| `verified` | enum (none, blue, gold) | No | blue |
| `image_url` | url | No |  |
| `timestamp` | string | No | 8:14 AM · Apr 30, 2026 |
| `replies` | string | No | 124 |
| `retweets` | string | No | 512 |
| `likes` | string | No | 4.2K |
| `views` | string | No | 182K |
| `theme` | enum (light, dim, dark) | No | light |

## Defaults

| Field | Default |
| --- | --- |
| `width` | 1200 |
| `height` | 800 |

## Example request

```bash
curl -X POST https://app.html2img.com/api/v1/templates/tweet-mockup-card \
  -H "X-API-Key: YOUR_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{"display_name":"Jordan Whitfield","handle":"@jwhitfield","body":"shipped a tiny side project this weekend and it already has more users than my last YC company\n\nfunny how that works","avatar_url":"https://i.pravatar.cc/160?img=15","verified":"blue","timestamp":"8:14 AM \u00b7 Apr 30, 2026","replies":"124","retweets":"512","likes":"4.2K","views":"182K","theme":"light"}'
```

## In your language

### PHP

```php
<?php
$response = \Illuminate\Support\Facades\Http::withHeaders([
    'X-API-Key' => 'YOUR_API_KEY',
])->post('https://app.html2img.com/api/v1/templates/tweet-mockup-card', ['display_name' => 'Jordan Whitfield', 'handle' => '@jwhitfield', 'body' => 'shipped a tiny side project this weekend and it already has more users than my last YC company

funny how that works', 'avatar_url' => 'https://i.pravatar.cc/160?img=15', 'verified' => 'blue', 'timestamp' => '8:14 AM · Apr 30, 2026', 'replies' => '124', 'retweets' => '512', 'likes' => '4.2K', 'views' => '182K', 'theme' => 'light']);

$url = $response->json('url');
```

### Node.js

```javascript
const response = await fetch('https://app.html2img.com/api/v1/templates/tweet-mockup-card', {
  method: 'POST',
  headers: {
    'X-API-Key': 'YOUR_API_KEY',
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({
    "display_name": "Jordan Whitfield",
    "handle": "@jwhitfield",
    "body": "shipped a tiny side project this weekend and it already has more users than my last YC company\n\nfunny how that works",
    "avatar_url": "https://i.pravatar.cc/160?img=15",
    "verified": "blue",
    "timestamp": "8:14 AM \u00b7 Apr 30, 2026",
    "replies": "124",
    "retweets": "512",
    "likes": "4.2K",
    "views": "182K",
    "theme": "light"
}),
});

const { url } = await response.json();
```

### Python

```python
import requests

response = requests.post(
    'https://app.html2img.com/api/v1/templates/tweet-mockup-card',
    headers={'X-API-Key': 'YOUR_API_KEY'},
    json={'display_name': 'Jordan Whitfield', 'handle': '@jwhitfield', 'body': 'shipped a tiny side project this weekend and it already has more users than my last YC company

funny how that works', 'avatar_url': 'https://i.pravatar.cc/160?img=15', 'verified': 'blue', 'timestamp': '8:14 AM · Apr 30, 2026', 'replies': '124', 'retweets': '512', 'likes': '4.2K', 'views': '182K', 'theme': 'light'},
)

url = response.json()['url']
```

## What it is for

### Marketing teams sharing real tweets in newsletters

Showing real social proof in a newsletter beats writing testimonials yourself. Render the customer's actual tweet (handle, body, timestamp, metrics) as a card, embed in the email body, and the newsletter shows lived feedback rather than corporate prose. The artwork stays consistent across many tweets because the styling is yours, not Twitter's. Halberd Software pulls 6 to 8 customer tweets per month into its weekly newsletter through this template.

### Presentations illustrating social proof

Sales decks and conference talks benefit from screenshots of customer tweets, but live screenshots have inconsistent styling and resolution. Render with the actual handle and body, set theme to "light" or "dark" to match your slide template, and every customer quote in the deck looks uniform. Wren Analytics' enterprise sales deck includes 12 customer tweet cards rendered through this exact pattern.

### Blog posts quoting tweets without Twitter's embed

The Twitter embed widget loads JavaScript, sets cookies, and slows page load. Render the tweet you want to quote as a static PNG, embed via a regular <img> tag, and the page stays fast and tracker-free. Northwind Studio's tutorial blog uses this for every tweet quoted in long-form content, and the page weight dropped 380 KB on average.

### Legal-safe testimonial styling

Some industries (finance, healthcare) require testimonial usage approval before display. Render approved tweets with consistent styling that includes any mandated disclaimers in a footer slot, and the testimonial display stays compliant across every channel where the tweet card appears. Linden & Co's financial services clients run this pattern for tweet-style testimonial pages, and compliance review time dropped from two weeks to two days because the visual treatment is fully repeatable.

### Internal recognition cards

HR and people teams collect kind words from peer recognition channels and surface them on internal Slack or town-hall slides. Render with the colleague's name and the message body, and the recognition feels weighted in a way a chat screenshot cannot match. Riverside Bakery recognizes one team member each Friday this way.

## Output

- **Dimensions:** 1200x800
- **Colour space:** sRGB
- **Transparency:** Not supported
- **Typical file size:** 70 KB to 220 KB
- **Platform specification:** [Tweet card visual styling reference](https://developer.x.com/en/docs/x-for-websites/embedded-tweets/overview)

## Common mistakes

### Putting words in real people's mouths

A fabricated quote rendered with a real handle is a legal and ethical problem regardless of intent. Always use this template with content the named author actually posted, or with consenting in-house participants in the case of internal recognition cards.

### Live tweet capture is the wrong tool here

For genuine quotes from existing tweets, screenshotting the live tweet via the Screenshot API is more accurate because it captures the actual published timestamp and metrics. Use this template only when you need consistent custom styling across many sources.

### Avatar URL fallbacks look generic

A 404 on avatar_url falls back to a placeholder shape that may not match your brand. Validate the avatar URL before posting, or supply a fallback host image that does match your design language so the failure case stays branded.

## Questions

### Is this for fake tweets?

No. Use this template for genuine tweet content displayed in your own brand-safe styling, or for internal-recognition messages where the source person has consented. Putting fabricated words into real people's mouths via this tool is a misuse and creates legal risk.

### How is this different from screenshotting a real tweet?

A live screenshot captures the actual rendered tweet with current metrics, while this template lets you render the same content in your own styling. Use the Screenshot API for accuracy and this template for brand consistency. Either route can also return format: "pdf" when the quoted post needs to sit in a report or an evidence file as a document.

### Can I include the metrics?

Yes, pass replies, retweets, likes, and views as separate string fields. The renderer prints them in the metrics row at the bottom of the card. Omit fields you do not want shown, and the row collapses to fit only the values you supplied.

### What if I do not have an avatar URL?

The renderer falls back to a default avatar shape if avatar_url is missing or returns a 404. The shape uses the accent_color, so it stays consistent with the rest of your brand styling rather than looking like a generic placeholder.

### Will it look like the real Twitter UI?

Close, but deliberately not pixel-identical. Use the rendered card as styled artwork that conveys the message, not as evidence of an actual published tweet. For attestation, take a screenshot of the live URL via the Screenshot API.

### Can I include media inside the tweet card?

Yes, pass image_url with a public URL to a photo or graphic that appeared in the original tweet. The renderer composites it into the media slot below the body text. Most teams skip the media slot for clean text-only quotes.

## Preview

![Tweet Mockup Card: Tweet Card Image Generator API example render](https://i.html2img.com/image-1777560103891-398848.png)

## Related templates

- [instagram-square-post](https://html2img.com/templates/instagram-square-post/)
- [open-graph-image](https://html2img.com/templates/open-graph-image/)
- [twitter-post](https://html2img.com/templates/twitter-post/)

## See also

- [Every template](https://html2img.com/templates/)
- [Templates API reference](https://html2img.com/docs/templates/)
- [OpenAPI specification](https://html2img.com/openapi.json)