Json To Social Card API

POST https://api.findutils.com/api/tools/json-to-social-card/execute

Generate a social-media / Open Graph card (1200x630 aspect) from JSON such as {"title","description","author","date","siteName","tag","background","textColor"} in one of 6 templates. Returns the card three ways: inline-style HTML, Tailwind CSS markup, and a React JSX component.

Open the tool Try it

Request body

application/json

json

string required

Card JSON: {"title": string, "description"?, "author"?, "avatar"?: url, "date"?, "siteName"?, "logo"?: url, "background"?: css color, "textColor"?: css color, "tag"?}.
template

string optional

Card template. Default "og-classic". One of og-classic · blog-post · dark-modern · gradient-hero · minimal-clean · brand-bold. Default "og-classic".

Example arguments

Verified

{
  "json": {
    "title": "How to Build Better Developer Tools",
    "description": "A guide to great DX.",
    "author": "Jane Developer",
    "date": "2024-01-15",
    "siteName": "DevBlog",
    "tag": "Engineering"
  }
}

curl -X POST https://api.findutils.com/api/tools/json-to-social-card/execute \
  -H "Content-Type: application/json" \
  -d '{
    "json": "{\"title\":\"How to Build Better Developer Tools\",\"description\":\"A guide to great DX.\",\"author\":\"Jane Developer\",\"date\":\"2024-01-15\",\"siteName\":\"DevBlog\",\"tag\":\"Engineering\"}"
  }'

const response = await fetch('https://api.findutils.com/api/tools/json-to-social-card/execute', {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify({"json":"{\"title\":\"How to Build Better Developer Tools\",\"description\":\"A guide to great DX.\",\"author\":\"Jane Developer\",\"date\":\"2024-01-15\",\"siteName\":\"DevBlog\",\"tag\":\"Engineering\"}"}),
});
const data = await response.json();

import requests

response = requests.post(
    "https://api.findutils.com/api/tools/json-to-social-card/execute",
    json={"json":"{\"title\":\"How to Build Better Developer Tools\",\"description\":\"A guide to great DX.\",\"author\":\"Jane Developer\",\"date\":\"2024-01-15\",\"siteName\":\"DevBlog\",\"tag\":\"Engineering\"}"},
)
data = response.json()

$ch = curl_init('https://api.findutils.com/api/tools/json-to-social-card/execute');
curl_setopt_array($ch, [
    CURLOPT_POST => true,
    CURLOPT_HTTPHEADER => ['Content-Type: application/json'],
    CURLOPT_POSTFIELDS => '{"json":"{\"title\":\"How to Build Better Developer Tools\",\"description\":\"A guide to great DX.\",\"author\":\"Jane Developer\",\"date\":\"2024-01-15\",\"siteName\":\"DevBlog\",\"tag\":\"Engineering\"}"}',
    CURLOPT_RETURNTRANSFER => true,
]);
$data = json_decode(curl_exec($ch), true);

Also an MCP tool

Call json_to_social_card from Claude, Cursor or any MCP client. Same arguments, same output.

https://mcp.findutils.com

MCP reference

Rate limit: 60 a minute, per IP
Auth: None
REST id: json-to-social-card
MCP name: json_to_social_card
Category: Generators
Machine-readable: openapi.json · markdown.md

Request body

Example arguments

More Generators tools

More to explore